the request is sent twice

[okashaParticipant]

hello

i am using this code to generate grid rows depending on the selected value from combo box , the problem is that when i change the combo box the request is being sent twice (in firebug)

$(‘#page_code_level’).bind(‘change’, function (event)
{
//alert(“i have changed”);
var page_code_level_selected=$(“#page_code_level”).jqxComboBox(‘getSelectedItem’);
selected_value=page_code_level_selected.value;
//alert(selected_value);
var source =
{
datatype: “json”,
datafields: [
{name: ‘page_code’},
{name: ‘page_title’},
{name: ‘page_created’},
{name: ‘page_modified’},
{name: ‘page_order’}

],data: {
show_childs_of: selected_value

},
url: base_url+’admin/pages/list’,
id:”page_code”,
addrow: function (rowid, rowdata, position, commit) {
var data = “insert=true&” + $.param(rowdata);
$.ajax({
dataType: ‘json’,
url: base_url+’admin/pages/list’,
type:”post”,
data: data,
cache: false,
success: function (data, status, xhr) {

commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
}
});
},

updaterow: function (rowid, rowdata, commit) {
var data = “update=true&” + $.param(rowdata);
$.ajax({
dataType: ‘json’,
url: base_url+’admin/pages/list’,
type:”post”,
cache: false,
data: data,
success: function (data, status, xhr) {
commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
}
});
},
root: ‘pages’,
beforeprocessing: function (data) {
//selected_value= 5;

source.totalrecords = data.pages_count;

}
};

var dataadapter = new $.jqx.dataAdapter(source);

$(“#jqxgrid”).jqxGrid(
{
width: 1190,
source: dataadapter,
theme: jqwidgets_theme,
autoheight: true,
pageable: true,
virtualmode: true,
rendergridrows: function () {
return dataadapter.records;
},
columns: [

{text: ‘حذف’, columntype: ‘button’,width:60},
{text: ‘تعديل’, datafield: ‘Edit’, columntype: ‘button’, cellsrenderer: function () {
return “تعديل”;
}, buttonclick: function (row) {
$(“#page_form_order”).html(‘<td>ترتيب الصفحة</td><td><input type=”text” name=”page_order” id=”page_order” value=”” size=”10″ maxlength=”4″> </td>’);

editrow = row;
//alert(editrow);
var offset = $(“#jqxgrid”).offset();
if(CKEDITOR.instances.page_content){
CKEDITOR.instances.page_content.destroy();
}

CKEDITOR.replace(‘page_content’);
$(“#popupWindow”).jqxWindow({position: {x: parseInt(offset.left) + 200, y: parseInt(offset.top)},width:1000,height:2000});

var dataRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, editrow);
$(“#page_code”).val(dataRecord.page_code);
$(“#page_title”).val(dataRecord.page_title);
$(“#page_order”).val(dataRecord.page_order);

CKEDITOR.instances.page_content.setData(”);

var data={“page_code”:dataRecord.page_code,”update”:true};
$.ajax({
dataType: ‘json’,
url: base_url+’admin/pages/tree’,
type:”post”,
cache: false,
data: data,
success: function (data, status, xhr) {
CKEDITOR.instances.page_content.setData(data.content);
$(‘#jqxTree’).jqxTree(‘destroy’);
$(“#dropDownButton”).jqxDropDownButton(‘destroy’);
$(“#drop_down_td”).html(‘<div id=”dropDownButton”></div>’);
$(“#dropDownButton”).html(‘<div id=”jqxTree”></div>’);
$(“#jqxTree”).html(data.tree);
$(“#dropDownButton”).jqxDropDownButton({width: 150, height: 25, theme: theme});
$(‘#jqxTree’).bind(‘select’, function (event) {
var args = event.args;
var item = $(‘#jqxTree’).jqxTree(‘getItem’, args.element);
var dropDownContent = ‘<div style=”position: relative; margin-left: 3px; margin-top: 5px;”>’ + item.label + ‘</div>’;
$(“#dropDownButton”).jqxDropDownButton(‘setContent’, dropDownContent);
});

$(“#jqxTree”).jqxTree({width: 200, theme: jqwidgets_theme});

},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
}
});

$(“#page_form_submit”).html(‘<button name=”update_page” id=”update_page” type=”button”>تعديل الصفحة</button>’);
$(“#user_form_title”).html(“تعديل بيانات صفحة”);

$(“#popupWindow”).jqxWindow(‘show’);
}
},
{text: ‘الترتيب’, datafield: ‘page_order’},

{text: ‘اخر تعديل’, datafield: ‘page_modified’, cellsrenderer: modifiedrenderer},
{text: ‘تاريخ الاضافة’, datafield: ‘page_created’, cellsrenderer: createdrenderer},
{text: ‘عنوان الصفحة’, datafield: ‘page_title’},
{text: ‘كود الصفحة’, datafield: ‘page_code’}
]
});

});

may you help me fix that

thank you

 

 

[Peter StoevKeymaster]

Hi okasha,

We are unable to understand the specific issue from the provided code. There could be multiple triggers of the ‘change’ event or there could be something else. Please, provide a sample which we will be able to run locally and that will allow us to test. You can send the sample to support@jqwidgets.com.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[okashaParticipant]

hello mr peter

i have modified my code to be like that and it is not working (firebug says:TypeError: f.source is undefined)
may you tell me where is the error

var dataadapter;
var theme =jqwidgets_theme;
var trackSource = {
datatype: “json”,
datafields: [
{name: ‘value’},
{name: ‘label’}
],
id: ‘value’,
url: base_url+’admin/pages/pagescodelevel’
};
var trackDataAdapter = new $.jqx.dataAdapter(trackSource);
$(“#page_code_level”).jqxComboBox({
width: 200,
height: 25,
selectedIndex: 0,
source: trackDataAdapter,
displayMember: ‘label’,
valueMember: ‘value’
});
$(‘#page_code_level’).bind(‘change’, function (event)
{
//console.log(event);
//console.log(“select”);
//a=20;

var page_code_level_selected=$(“#page_code_level”).jqxComboBox(‘getSelectedItem’);
selected_value=page_code_level_selected.value;
//alert(selected_value);
var source =
{
datatype: “json”,
datafields: [
{name: ‘page_code’},
{name: ‘page_title’},
{name: ‘page_created’},
{name: ‘page_modified’},
{name: ‘page_order’}

],data: {
show_childs_of: selected_value

},
url: base_url+’admin/pages/list’,
id:”page_code”,
addrow: function (rowid, rowdata, position, commit) {
var data = “insert=true&” + $.param(rowdata);
$.ajax({
dataType: ‘json’,
url: base_url+’admin/pages/list’,
type:”post”,
data: data,
cache: false,
success: function (data, status, xhr) {

commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
}
});
},

updaterow: function (rowid, rowdata, commit) {
var data = “update=true&” + $.param(rowdata);
$.ajax({
dataType: ‘json’,
url: base_url+’admin/pages/list’,
type:”post”,
cache: false,
data: data,
success: function (data, status, xhr) {
commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
}
});
},
root: ‘pages’,
beforeprocessing: function (data) {
//selected_value= 5;

source.totalrecords = data.pages_count;

}
};

dataadapter = new $.jqx.dataAdapter(source);

});

$(“#jqxgrid”).jqxGrid(
{
width: 1190,
source: dataadapter,
theme: jqwidgets_theme,
autoheight: true,
pageable: true,
virtualmode: true,
rendergridrows: function () {

return dataadapter.records;
},
columns: [

{text: ‘حذف’, columntype: ‘button’,width:60},
{text: ‘تعديل’, datafield: ‘Edit’, columntype: ‘button’, cellsrenderer: function () {
return “تعديل”;
}, buttonclick: function (row) {
$(“#page_form_order”).html(‘ترتيب الصفحة ‘);

editrow = row;
//alert(editrow);
var offset = $(“#jqxgrid”).offset();
if(CKEDITOR.instances.page_content){
CKEDITOR.instances.page_content.destroy();
}

CKEDITOR.replace(‘page_content’);
$(“#popupWindow”).jqxWindow({position: {x: parseInt(offset.left) + 200, y: parseInt(offset.top)},width:1000,height:2000});

var dataRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, editrow);
$(“#page_code”).val(dataRecord.page_code);
$(“#page_title”).val(dataRecord.page_title);
$(“#page_order”).val(dataRecord.page_order);

CKEDITOR.instances.page_content.setData(”);

var data={“page_code”:dataRecord.page_code,”update”:true};
$.ajax({
dataType: ‘json’,
url: base_url+’admin/pages/tree’,
type:”post”,
cache: false,
data: data,
success: function (data, status, xhr) {
CKEDITOR.instances.page_content.setData(data.content);
$(‘#jqxTree’).jqxTree(‘destroy’);
$(“#dropDownButton”).jqxDropDownButton(‘destroy’);
$(“#drop_down_td”).html(‘

‘);
$(“#dropDownButton”).html(‘

‘);
$(“#jqxTree”).html(data.tree);
$(“#dropDownButton”).jqxDropDownButton({width: 150, height: 25, theme: theme});
$(‘#jqxTree’).bind(‘select’, function (event) {
var args = event.args;
var item = $(‘#jqxTree’).jqxTree(‘getItem’, args.element);
var dropDownContent = ‘

‘ + item.label + ‘

‘;
$(“#dropDownButton”).jqxDropDownButton(‘setContent’, dropDownContent);
});

$(“#jqxTree”).jqxTree({width: 200, theme: jqwidgets_theme});

},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
}
});

$(“#page_form_submit”).html(‘تعديل الصفحة’);
$(“#user_form_title”).html(“تعديل بيانات صفحة”);

$(“#popupWindow”).jqxWindow(‘show’);
}
},
{text: ‘الترتيب’, datafield: ‘page_order’},

{text: ‘اخر تعديل’, datafield: ‘page_modified’, cellsrenderer: modifiedrenderer},
{text: ‘تاريخ الاضافة’, datafield: ‘page_created’, cellsrenderer: createdrenderer},
{text: ‘عنوان الصفحة’, datafield: ‘page_title’},
{text: ‘كود الصفحة’, datafield: ‘page_code’}
]
});

thank you
okasha

[Peter StoevKeymaster]

Hi okasha,

As far as I can see from the posted code, you do not set the Grid’s source property to point to the new dataAdapter instance when the ComboBox’s value is changed. You also create a dataAdapter instance only when the ComboBox’s value is changed, but in the initial call of jqxGrid constructor, the dataAdapter instance and the source object are undefined, because you define them only in your “change” event handler.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[okashaParticipant]

hello Mr peter

the change event is executed when the page is loaded the problem is when i update the dataadapter variable inside the function it doesn’t updated outside the function although it is global variable

i am sorry i know that i have disturbed you so much but i really need to solve it

thank you

[Peter StoevKeymaster]

Hi okasha,

In your change callback, after the dataAdapter’s initialization, according to me you should do that:

$(“#jqxgrid”).jqxGrid(
{
source: dataadapter
});

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[okashaParticipant]

thank you very much mr peter it is working now

[Author]

Posts