typed Combobox value not being submitted or echoed

[AnywarParticipant]

This is my jason file.
Please help me. I am stuck.

<?php
  #Include the connect.php file
  include('db_connect2.php');
 //get county of selected district
 $query = "SELECT * FROM primary_schools ";

  $result = mysql_query($query) or die("SQL Error 1: " . mysql_error());
  while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
	  $customers[] = array(
          'Emis_No' => $row['Emis_No'],
		  'District' => $row['District'],
		  'County' => $row['County'],
		  'Subcounty' => $row['Subcounty'],
		  'Parish' => $row['Parish'],
		  'School' => $row['School']
	       );
  }

  echo json_encode($customers);
?>

My Script:

<script type=”text/javascript”>

$(document).ready(function () {
		//start EMIS code
			var customersSourcel =
		{
			datatype: "json",
			datafields: [
				{ name: 'Emis_No'},
				{ name: 'District'},
				{ name: 'County'},
				{ name: 'Subcounty'},
				{ name: 'Parish'},
				{ name: 'School'}
			],
			url: 'includes/emis.php',
			cache: false,
            async: false
		};
		
		var customersAdapterl = new $.jqx.dataAdapter(customersSourcel);

		$("#emis_no").jqxComboBox(
		{
			source: customersAdapterl,
			
			width: 200,
			height: 25,
			promptText: "emis",
			displayMember: 'Emis_No',
			valueMember: 'Emis_No'
		});
		
		$("#emis_no").bind('select', function(event) 
		{
			if (event.args)
			{
				var index = $("#emis_no").jqxComboBox('selectedIndex');		
				if (index != -1)
				{
					var record = customersAdapterl.records[index];
					document.form1.district.value = record.District;
					$("#county").jqxComboBox({ disabled: false});
					document.form1.county.value = record.County;
					$("#sub_county").jqxComboBox({ disabled: false});
					document.form1.sub_county.value = record.Subcounty;
					$("#parish").jqxComboBox({ disabled: false});
					document.form1.parish.value = record.Parish;
					$("#school").jqxComboBox({ disabled: false});
					document.form1.school.value = record.School;
				}
			}
		});    

//END EMIS CODE

Thank you.

[AnywarParticipant]

I tried to initialise customers as seen below, but still nothing..instead its just showing now the last record in the database, and when I type, still, the value is not picked/ echoed. Somebody please help.
Thank you
$customers =array();
$customers[] = array( ‘Emis_No’ => $row[‘Emis_No’], ‘District’ => $row[‘District’], ‘County’ => $row[‘County’], ‘Subcounty’ => $row[‘Subcounty’], ‘Parish’ => $row[‘Parish’], ‘School’ => $row[‘School’] );

[DimitarParticipant]

Hello Anywar,

The following demo shows how to submit selected jqxComboBox value to the database (in a PHP server-side environment): http://www.jqwidgets.com/jquery-widgets-demo/demos/php/combobox.htm?light.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[AnywarParticipant]

Hello, I can submit selected. My problem is It cannot submit Typed values.

I can pick values from the database. and select them and then submit.

For example, if a value from the database is misspelt, and i need to edit it..The edited value is not submit where it should go.

Please help.

[DimitarParticipant]

Hello Anywar,

You cannot edit an existing item through the combobox’s input, but you can add a new item with the method addItem. Here is how to do so when you have entered a new item and have pressed Enter: https://www.jseditor.io/?key=jqxcombobox-add-item-on-enter.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[AnywarParticipant]

Hello Dimitar,
Thanks..for this..
But then..the scenario is that I have a jason file pulling data from mysql database table A.
Then the data is selected and displayed on the combobox.
However there are some I also want to add a new values, so I have to type the value into the combobox.
So how do I get either typed value or selected value picked by php and either echoed or submitted to the database.

Thank you for your help.

[AnywarParticipant]

This is what I have done basing on that example, and still it is not being picked by php.(I mean the typed values.

$(document).ready(function () {
		//start EMIS code
			var customersSourcel =
		{
			datatype: "json",
			datafields: [
				{ name: 'Emis_No'},
				{ name: 'District'},
				{ name: 'County'},
				{ name: 'Subcounty'},
				{ name: 'Parish'},
				{ name: 'School'}
			],
			url: 'includes/emis.php',
			cache: false,
            async: false
		};
		
		var customersAdapterl = new $.jqx.dataAdapter(customersSourcel);

		$("#emis_no").jqxComboBox(
		{
			source: customersAdapterl,
			
			width: 200,
			height: 25,
			promptText: "emis",
			displayMember: 'Emis_No',
			valueMember: 'Emis_No'
		});
		
		 $("#emis_no input").on('keypress', function(event) {
                 var enteredValue = $("#emis_no input")[0].value;
                if (event.key === 'Enter') {
                 var existingItem = $("#emis_no").jqxComboBox('getItemByValue', enteredValue);
                 if (existingItem === undefined) {
                 $("#emis_no").jqxComboBox('addItem', enteredValue);
                 var item = $("#emis_no").jqxComboBox('getItemByValue', enteredValue);
                 $("#emis_no").jqxComboBox('selectItem', item);
                  }
                    }
                 });

		
		//END EMIS CODE

[AnywarParticipant]

I also tried renaming the from (“#emis_no Input”) to just (“#emis_no”) but still values not being captured.

[DimitarParticipant]

Hello Anywar,

The demo I referred to you earlier (http://www.jqwidgets.com/jquery-widgets-demo/demos/php/combobox_and_grid.htm?light) shows how to submit the selected combobox item to the database. The example from my previous post (https://www.jseditor.io/?key=jqxcombobox-add-item-on-enter) only shows how to add a new, custom, item to the list. This means your implementation should be a combination of both these examples.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[AnywarParticipant]

Hello Dimitar,
I ended up combining the two as seen in the code below;
But still no change or effect to the issue.

<script type="text/javascript">
$(document).ready(function () {
		//start EMIS code
			var customersSourcel =
		{
			datatype: "json",
			datafields: [
				{ name: 'Emis_No'},
				{ name: 'District'},
				{ name: 'County'},
				{ name: 'Subcounty'},
				{ name: 'Parish'},
				{ name: 'School'}
			],
			url: 'includes/emis.php',
			cache: false,
            async: false
		};
		// Create a jqxComboBox
		var customersAdapterl = new $.jqx.dataAdapter(customersSourcel);

		$("#emis_no").jqxComboBox(
		{
			source: customersAdapterl,
			
			width: 200,
			height: 25,
			promptText: "emis",
			displayMember: 'Emis_No',
			valueMember: 'Emis_No'
		});
		
		$("#emis_no").bind('select', function(event) 
		{
			if (event.args)
			{
				var index = $("#emis_no").jqxComboBox('selectedIndex');		
				if (index != -1)
				{
					var record = customersAdapterl.records[index];
					document.form1.district.value = record.District;
					$("#county").jqxComboBox({ disabled: false});
					document.form1.county.value = record.County;
					$("#sub_county").jqxComboBox({ disabled: false});
					document.form1.sub_county.value = record.Subcounty;
					$("#parish").jqxComboBox({ disabled: false});
					document.form1.parish.value = record.Parish;
					$("#school").jqxComboBox({ disabled: false});
					document.form1.school.value = record.School;
				}
			}
		});    

	        $("#emis_no input").on('keypress', function(event) 
		{
                 var enteredValue = $("#emis_no input")[0].value;

                if (event.key === 'Enter') 
		{
                 var existingItem = $("#emis_no").jqxComboBox('getItemByValue', enteredValue);
                 if (existingItem === undefined)
		 {
                 $("#emis_no").jqxComboBox('addItem', enteredValue);
                 var item = $("#emis_no").jqxComboBox('getItemByValue', enteredValue);
                 $("#emis_no").jqxComboBox('selectItem', item);
                  }
                    }
                 });

		
		//END EMIS CODE

[DimitarParticipant]

Hello Anywar,

Is your combobox placed in a form element and do you have a submit button? These are key to submitting the selected combobox value to the database. Please take a careful look at the source code of the aforementioned Bind ComboBox to MySQL Database demo.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[AnywarParticipant]

Hello Dimitar,
I can actually submit to the database, and also display values from the databases.
But am still failing to pick values entered/typed(values that dont exists inside the db.) into the combobox.
Values selected are coming from a Jason file. and different table.
So when selected or when a new value is typed, its entered into another table.

The fact that i can submit selected values…Means the combobox is within a Form element.

Since i am cascading combos, could the `$(“#emis_no”)<em><strong>.bind</strong>&lt</em>(‘select’, function(event) be the one causing this unusual behaviour..?
`

[DimitarParticipant]

Hello Anywar,

I am sorry, but your requirement represents a custom scenario we cannot assist you with. We can only provide you with resources (examples and help topics) that showcase the features of our widgets and help with advice. If you wish, you can request a custom requirement by writing to our Sales department at sales@jqwidgets.com.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts