变量犯规刷新后AJAX请求完成 [英] Variables doesnt refresh after AJAX request completed
问题描述
我在页面中的对象的网格。例如：
OBJ1，OBJ2，obj3，...
每个对象都有一个选项，编辑，这将打开模态窗口（ui.dialog）和负载（.load（））的模板，其中有一些投入，文字区域等编辑有关对象的信息。有一个按钮完成编辑，它通过AJAX。员额发送POST请求到PHP文件（）。经过约的对象，信息必须进行编辑。
有没有问题，PHP或MySQL，问题只在JS。第一次更新后，似乎一切都很好，但是当我点击OBJ2进行编辑和preSS完成编辑，变量，这是我写的输入值 - 来自previous操作
OBJ1。 VAR1 ='文本1'; VAR2 ='文本2';
OBJ2。 VAR1 ='文本3'; VAR2 ='文本4';
例如在OBJ1我已经派了一个数据：V1：VAR1，V2：VAR2。好的。但是，在OBJ2又将文本1和文本2也一样，不是文本3和文本4。
我也做了VAR1.VAL（''），但它没有帮助，第二次也派出了空值：）
在code：
$（编辑）。点击（函数（）{
VAR模式= $（'＆LT; DIV CLASS =对话框中的ID =对话框，新的消息＆GT;＆LT; DIV＆GT;＆LT; / DIV＆GT;＆LT; / DIV＆GT;'）;
modal.dialog（{
模式：真正的，
宽度：300，
高度：300，
的AutoOpen：真
}）;
modal.find（＆GT;的div）。负载（someurl'，函数（）{
modal.dialog（开放）;
modal.find（＃完成按钮）。点击（函数（）{
。VAR VAR1 = $（'＃someid1）VAL（）;
。VAR VAR2 = $（'＃someid2）VAL（）;
$阿贾克斯（{
网址：someurl，
类型：'后'，
数据： {
V1：VAR1，
V2：VAR2
}，
成功：功能（数据）{
modal.dialog（亲密）;
//这里是一些刷新code刷新页面编辑的信息...没什么大碍
}
}）;
}）;
}）;
}）;
我认为这个问题是您要重新对话，但你不破坏旧的。它可能来自你创建第一个得到的值。尝试添加关闭回调至 modal.dialog（）功能，删除分区，像这样：
modal.dialog（{
模式：真正的，
宽度：300，
高度：300，
的AutoOpen：真
关闭：函数（）{modal.remove（）; } // $（本）上卸下摆臂（）;也可能会奏效。
}）;
，以便下一次打开模态对话框的ID在它仍然是唯一的这应该删除原来的分区。
您可以验证这是发生使用浏览器的工具和检查，看看有什么DOM看起来像第二个运行后。
修改
你是另一种选择是保存对话框中的全局变量，然后检查它是否已被定义。如果还没有做到，你在做什么。如果是，设置一个变量来告诉它的ID是你正在编辑的项目是什么，并在运行前 .dialog（打开）中的所有文本框重置为空白; 。
I have a grid of the 'objects' in the page. For example:
obj1, obj2, obj3, ...
Every object has an option 'Edit', which opens the modal window (ui.dialog) and loads (.load()) the template, where are some inputs, textareas, etc. to edit the information about the object. There is a button 'Finish editing', which sends POST request to the PHP file via AJAX .post(). After that information about the object must be edited.
There aren't problems with PHP or MySQL, the problem is only in JS. After the first update everything seems to be fine, but when i click on the 'obj2' to edit it and press 'Finish editing', variables, in which i wrote the input values - are from the previous operation.
obj1. var1 = 'text1'; var2 = 'text2';
obj2. var1 = 'text3'; var2 = 'text4';
For example in 'obj1' i have sent the next data: 'v1' : var1, 'v2' : var2. Its ok. But in 'obj2' it sent the 'text1' and 'text2' too, not the 'text3' and 'text4'.
I have done the var1.val(''), but it didnt helped, second time it had sent the empty value :)
The code:
$(".edit").click(function(){
var modal = $('<div class="dialog" id="dialog-new-message"><div></div></div>');
modal.dialog({
modal: true,
width: 300,
height: 300,
autoOpen: true
});
modal.find(">div").load('someurl', function(){
modal.dialog('open');
modal.find("#finish-button").click(function() {
var var1 = $('#someid1').val();
var var2 = $('#someid2').val();
$.ajax({
url: 'someurl',
type: 'post',
data: {
'v1' : var1,
'v2' : var2
},
success: function(data) {
modal.dialog('close');
// here is some refresh code to refresh the edited info in the page ... nothing serious
}
});
});
});
});
I think the problem is that you're recreating the dialog, but you're not destroying the old one. It's probably getting the values from the first one you create. Try adding a close callback to the modal.dialog() function which removes the div like so:
modal.dialog({
modal: true,
width: 300,
height: 300,
autoOpen: true
close: function() { modal.remove(); } //$(this).remove(); Might also work.
});
This should remove your original div so that next time the modal dialog is opened the IDs within it are still unique.
You can verify that this is happening by using your browser's tools and checking to see what the DOM looks like after the second one is run.
Edit
You're other option is to save the dialog in a global variable, and then check if it has been defined yet. If it hasn't do what you're doing. If it has, set a variable to tell it what the ID is of the item you're editing and reset all the text boxes to blank before running .dialog("open"); again.
这篇关于变量犯规刷新后AJAX请求完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
