jQuery UI Widgets › Forums › Plugins › Data Adapter › how to use dataAadaptor on event on-change of jqxInput
Tagged: Input, input widget, jQuery Input, textbox
This topic contains 1 reply, has 2 voices, and was last updated by Peter Stoev 9 years, 3 months ago.
-
Author
-
Hi,
we would like to know how to use dataAadaptor on event on-change of jqxInput.
Required steps of procedure are as next. 1. key-in key value to jqxInput 2. At on change, get JSON from outside data 3. show record data to identified columns
we tried to make code as below however it seems not worked on dataAdaptor proc.
pls kindly let us know how to do it.$(document).ready(function () {
var keyValue;var source ={
datatype: “json”,
datafields: [
{ name: ‘RONo’ },
{ name: ‘LineNo’ },
{ name: ‘ItemNo’ },
{ name: ‘ItemDesc’ },
{ name: ‘ItemSpec’ },
{ name: ‘PONo’ },
{ name: ‘VenderName’ },
{ name: ‘ReqOHDate’, type: ‘date’ },
{ name: ‘POQty’, type: ‘float’ }
],
// url: ‘getPODetail.php?refNo=’ + keyValue
url: ‘getPO3.php’
};$(“#input2”).jqxInput({ height: 25, width: 200, minLength: 1 });
$(‘#input2’).jqxInput(‘focus’);
$(“#jqxbutton”).jqxButton({ theme: ‘energyblue’, width: 100, height: 30 });// bind to ‘change’ event.
$(‘#input2’).on(‘change’, function (event) {
keyValue = $(‘#input2’).val();
$(‘#refNo’).text(keyValue);
var dataAdapter = new $.jqx.dataAdapter(source, {
loadComplete: function (records) {
var records = dataAdapter.records;
var rec = records[0];
$(‘#refNo’).text(rec.RONo);
}
});
dataAdapter.dataBind();
});$(“#jqxbutton”).click(function () {
alert(‘Hello test’);
});
});</script>
<form id=”basicForm”>
<table class=”register-table” border=”1″cellpadding=”10″>
<tr>
<td colspan=”2″ align=”center” bgcolor=”#b0c4de”><br><font color=”#191970″><b>入庫登録<br></b></font><br></td>
</tr>
<tr>
<td><b>QRコード:</b></td>
<td>
<input type=”text” id=”input2″ class=”text-input” />
</td>
</tr>
<tr>
<td><b>Ref#:</b></td>
<td id=”refNo”></td>
</tr>
</table>
</form>Hi,
Here is a demo: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxinput/bindingtojson.htm?arctic which demonstrates how to use jqxDataAdapter with jqxInput.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.