Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Guru Srini
95
Set Textbox value on a Row Edit Dialog using jquery
posted

HI,

I have an igGrid with the edit Mode set to 'Dialog'. I'm using a dialog template to render the fields on the dialog. I have a button next to a textbox (like a LookUp button) on the dialog which makes an ajax call and , depending on the value entered, populates other textbox fields. 

I'm using the jquery val() method to set the values received form the ajax call. I can see the value in the textbox, but when I click the textbox, the value disappears. Please help.

Here's a sample:

function LookUpID(id) {
var field = $("[data-editor-for-Name]");
$.ajax({
type: "GET",
contentType: "application/json; charset=utf-8;",
url: '@Url.Action("LookupID")',
data: {
'id': id,
},
dataType: 'json',
success: function (resp) {
if (resp.success) {
field.val(resp.Name);
}
else
alert("Error:" + resp.error);
},
error: function (jqXHR, status, error) {
alert("Error:" + error)
}
});
}

Regards,

Guru

  • 485
    Offline posted

    Hello Guru,

     

    Thank you for posting in our forum.

    The editors in the dialog are igEditors. Interacting with them using jQuery API is not recommended as you can see from the behavior you observe.

    What I would suggest is that you use the igGridUpdating API to update the editors via their methods. You could change this code:

    var field = $("[data-editor-for-Name]");

    ….

    field.val(resp.Name);

    … with this:

    $("#grid").igGridUpdating("editorForKey", "Name").igTextEditor("value", "TheNewValue")

     

    Please note that in the code above “Name” refers to your respective columnKey.

    If you need any additional assistance, feel free to contact me.