How to populate jqxInput with field from database

[ArneaultParticipant]

Hi everybody

I have jqxInput which represents the title of a book and want to populate this with an initial value from mysql database. User must be able to change the title in the jqxInput. I tried a lot but I can’t get it fixed.

Here is my code:
// prepare the data
var systeemsource =
{
datatype: “json”,
datafields: [
{ name: ‘Titel’, type: ‘string’ },
{ name: ‘VoorbladAanUit’, type: ‘string’ },
{ name: ‘LogboekAanUit’, type: ‘string’ }
],
url: ‘sql_get_systeem.php’
};

var systeem_dataAdapter = new $.jqx.dataAdapter(systeemsource, {
loadComplete: function (records) {
var records = systeem_dataAdapter.records;
var systeemvariabelen = records[0];
alert(‘1-‘ + systeemvariabelen.Titel);
},
loadError: function (jqXHR, status, error) {
},
beforeLoadComplete: function (records) {
}
});
systeem_dataAdapter.dataBind();

alert(‘2-‘ );

//input titel voorblad displayMember: ‘Titel’, valueMember: ‘Titel’,
/*$(“#invoertitel”).jqxInput({ source: systeemvariabelen.Titel, placeHolder: “Voer titel in”, height: 25, width: 200, minLength: 1 });*/
$(“#invoertitel”).jqxInput({ placeHolder: “Voer titel in”, height: 25, width: 200 });
$(“#invoertitel”).val(systeemvariabelen.Titel);

At alert(‘1-‘ + systeemvariabelen.Titel) I get the title I want, but I can’t get the title in $(“#invoertitel”).val(systeemvariabelen.Titel).
What am I doing wrong?
Can you help me?

Thanks
Arneault

[ivailoParticipant]

Hi Arneault,

You have to :
– set your source to dataAdapter – source: systeem_dataAdapter;
– set a display member displayMember: "Titel";
– use global variable cause systeemvariabelen is visible only in loadComplete function;

This demo may help you.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[ArneaultParticipant]

Hi Ivailo,
thanks for you quick answer. I have noticed your example.
But I still have a question: the contents of the jqxInput needs to be at startup the contents of the first field of the first record of the database. That’s why I wrote ‘records[0]’. The first field is called ‘Titel’. It is that contents that I want to present at startup. I also made systeemvariabelen a global variable.
I have copied my script below. Can you help me once again?

var systeemvariabelen;
//laden van tabel systeem
// prepare the data
var systeemsource =
{
datatype: “json”,
datafields: [
{ name: ‘Titel’, type: ‘string’ },
{ name: ‘VoorbladAanUit’, type: ‘string’ },
{ name: ‘LogboekAanUit’, type: ‘string’ }
],
url: ‘sql_get_systeem.php’
};

var systeem_dataAdapter = new $.jqx.dataAdapter(systeemsource, {
loadComplete: function (records) {
var records = systeem_dataAdapter.records;
systeemvariabelen = records[0];
alert(‘1-‘ + systeemvariabelen.Titel);
},
loadError: function (jqXHR, status, error) {
},
beforeLoadComplete: function (records) {
}
});
systeem_dataAdapter.dataBind();

alert(‘2-‘ );

//input titel voorblad displayMember: ‘Titel’, valueMember: ‘Titel’,
$(“#invoertitel”).jqxInput({ source: systeem_dataAdapter, displayMember: ‘Titel’, placeHolder: “Voer titel in”, height: 25, width: 200 });

[ivailoParticipant]

Hi Arneault,

You can set the value of your jqxInput directly into the loadComplete function.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts