2014-01-07 205 views
0

我有一个提交按钮id = submit,我用来保存新记录。更改运行时jquery id属性

// Add new customer 
       $("#submit").click(function() { 
        var data = $.param($("#form").serializeArray()); 
        event.preventDefault(); 
        $.ajax({ 
         type: "POST", 
         url: "crudcustomers.php", 
         data: data, 
         success: function(msg) { 
          $("#message").attr('class', 'alert alert-success'); 
          $("#message").html(msg); 
          // Rebind datagrid after record added. 
          getRecords(); 
         } 
        }); 
       }); 

现在,当我来到了更新现有记录我简单填充现有记录到表单字段和运行时我改变ID =提交ID =更新。见下文。

success: function(response) { 
          /*console.log(response);*/ 
          // Taking ajax response into javascript objects to fill the form fields 
          object = $.parseJSON(response); 
          $("#customername").attr('value', object[0].name); 
          $("#customercnic").attr('value', object[0].cnic); 
          $("#customeraddress").attr('value', object[0].address); 
          $("#customeremail").attr('value', object[0].email); 
          $("#customerphone").attr('value', object[0].phone); 
          $("#submit").attr('id','update'); // i change the attr here 
         } 

我现在想运行一个函数

// Update customers 
       $("#update").click(function(){ 
        alert("working"); 
       }); 

但不是运行警报功能#update.click还运行我的救命记录function..I试图将其置于文档外.ready但没有工作

请帮助我谢谢。

+1

改变的ID一个元素不会删除任何已经分配给它的事件处理程序。使用'.off()'移除事件处理程序,以及分配新的处理程序。 – Archer

+1

为什么不创建两个按钮并一次显示其中一个按钮? –

+0

@SalmanA可以是一个选项,让我们看看这个问题是否可以解决,否则我会尝试你的建议 – Raheel

回答

3

你应该使用委托,如:

$(document).on('click','#update',function(){...}); 

与同为提交:

$(document).on('click','#submit',function(){...}); 

文件应该由最靠近静态容器

这是说,开关元件来代替ID从来不是一个好主意AFAIK

+0

谢谢我使用了代表团。我想我应该得到代表团的概念。任何方式,谢谢你的工作) – Raheel

+0

这是一个很好的阅读进入:http://learn.jquery.com/events/event-delegation/ –

1

当您更改ID,你也应该取消绑定事件处理程序,如下所示:

$("#submit").attr('id','update').off('click'); 

jQuery Off

+0

我用你的代码替换,虽然它停止旧的功能来执行手段它解除了现有的事件。但它也没有运行我附加的新功能点击 – Raheel

+0

@Raheel您何时将点击事件绑定到#update元素上?它是否在您更改ID之后? –

+0

是当用户点击编辑链接我改变按钮ID从#提交到#更新...然后我做了一个函数#update.click ... – Raheel

1

在这种情况下,你已经改变了元素的ID,但你并没有改变附加到DOM事件目的。

例如,您有一个具有id = submit和event click(function1(){})的DOM对象Form。

当你改变元素的id时,你有一个带id = update和event click(function1(){}和function2(){})的DOM对象Form。你应该使用:$(“#submit”)。unbind(“click”); OR $(“#update”)。unbind(“click”);

+0

detach不删除事件定义和用法 detach()方法删除选定的元素,包括所有文本和子节点。但是,它保留了数据和事件。 – Raheel

+0

我的不好,试试这个:$(“#submit”)。unbind(“click”); OR $(“#update”)。unbind(“click”); –

+0

让我试试这个 – Raheel

0

如果函数调用最多一次(即你不打算去之间来回提交和更新),那么一个可能的解决方案是重写你的代码是这样的:

$("#submit").attr("id", "update").off("click").on("click", function() { 
    alert("Update"); 
});