Question

我正在尝试编辑我的表行（img：http://imgur.com/yTpfCIc）并将更改的数据POST到我的edit.php文件中。我试图通过jQuery做到这一点。但是，当我点击保存按钮时没有任何反应，这是解释的javascript：

//Getting all "Edit" buttons in the table (one for each row)
var buttons = document.getElementsByClassName("clicker");

var savebutton = function(id){
    //Alert the Id of the button to see if the function is being called, and it is.
    alert(id);
    //If I have any $_POST["action"] different from "update" or "edit" I should get redirected to a page apologizing, saying this cant happen. But nothing happens. (not problem with edit.php, because already tried via another way of posting from another page)
    $.post( "edit.php", { action: "test"} );
};

var buttonclicked = function(e){
    if(e.target.textContent == "Edit")
    {         
        //In this function I create a lot of inputs that you see in the picture and cannot be submited one at a time
        e.target.textContent = "Cancel";
        var id = e.target.id;
        var editable_elements = document.querySelectorAll("[contenteditable=false]");
        var sub = document.getElementById("sub"+id);  

        var j = document.createElement("input");
        j.setAttribute("type", "text");
        j.setAttribute("name", "subject");
        j.setAttribute("value", sub.textContent);
        j.setAttribute("placeholder", sub.textContent);
        j.setAttribute("style", "width: 150px");
        j.textContent = sub.textContent;
        sub.innerHTML = "";
        sub.appendChild(j);

        for(var k = (id*6); k < (id*6)+6; k++){
            var l = k;
            var index = k -(k*id) + 1;

            l = document.createElement("input");
            l.setAttribute('type',"number");
            l.setAttribute("style", "width: 75px");
            l.setAttribute("step", "0.01");
            if(index <= 4){
                l.setAttribute('name',"g"+index);
                l.setAttribute('placeholder',"G"+index);
                l.setAttribute("value", editable_elements[k].textContent);
            }
            else if(index == 5){
                l.setAttribute('name',"creditos");
                l.setAttribute('placeholder',"credits");
                l.setAttribute("value", editable_elements[k].textContent);
            }
            else if(index == 6){
                l.setAttribute('name',"criteria");
                l.setAttribute('placeholder',"criteria");
                l.setAttribute("value", editable_elements[k].textContent);
            }
            editable_elements[k].innerHTML = "";
            editable_elements[k].appendChild(l);}

        //If any edit button is pressed, create a save button in the same row 
        var s = document.createElement("input");
        s.textContent = "Save";
        s.setAttribute('type',"button");
        s.setAttribute('value',"update");
        s.setAttribute("id", id);
        s.setAttribute("name", "a");

        //Call the function that is supposed to POST all inputs infotmations
        s.setAttribute("onclick", "savebutton(this.id)");
        var clickbutton = document.getElementById("save"+id);
        clickbutton.appendChild(s);

    }
    else //save button has been clicked
    {
        //nothing
    }
};

//If one of those buttons is clicked call the function
for(var j = 0; j < buttons.length; j++)
{
    buttons[j].addEventListener('click', buttonclicked);
}

这是我的问题...... 如果您想查看整个页面，请点击此处：http://pastie.org/10578782

Answer 1

您的代码中有以下评论：

//如果我有任何$ _POST [“action”]与“更新”或“编辑”不同我应该被重定向到一个页面道歉，说这不可能发生。但没有任何反应。（没有edit.php的问题，因为已经尝试过了通过另一种方式从另一页发布）

    $.post( "edit.php", { action: "test"} );

当您通过ajax发布时，重定向不起作用。在浏览器中打开开发工具并检查网络流量。我很确定edit.php页面正在发布。您需要使用回调函数来检查后期操作的响应并采取相应的操作，例如：

$.post( "edit.php", { action: "test"}, function(data) {
  //data is the response from the edit.php
  alert(data);
});

尝试使用此代码，查看警告框中的内容。如果您想“重定向”，可以在回调中使用document.location.href = 'whatever.php';代替alert();语句。

使用

1 个答案: