19.1 添加用戶修改的按鈕

打開userManage.html，找到新增按鈕的地方：

我們不難發現，編輯按鈕就差不多應該在新建用戶的右邊。

那麽，假如我現在是新人，對這個項目本身就不太熟悉，那麽我得先找到這個頁面，然後再去對應的頁面找到新增按鈕，然後在新增按鈕的右邊加上對應的代碼。代碼怎麽寫，我先不管，第一個事情就是去找到這個頁面在哪。

方法：在這個頁面上右鍵，點擊 查看框架源代碼

這個userManage.html就是該網頁的地址。

打開userManage.html，ctrl + F一下，搜索新建用戶這幾個字。

找到了這個地方以後，可以發現，原來，這個新增的按鈕就是一個a標簽，於是，我們依葫蘆畫瓢。

這邊和之前的代碼相比，做一個修改，新建用戶的按鈕，綁定的函數名稱改為openAddDialog。

函數代碼：

//打開新增窗口
function openAddDialog(){
    
    $("#dialog0").dialog("setTitle","新增用戶").dialog("open");

}

//打開修改窗口
function openModifyDialog(){

    $("#dialog0").dialog("setTitle","編輯用戶").dialog("open");
}

再來看一下保存方法：

發現一個問題，之前的保存，因為只有新增，所以是不帶ID的。那如果現在我們要求這個保存方法既可以新增，也可以修改。就需要動態地變更一下url。

新增： url = save.php
修改：： url = save.php?id=XXX
代碼：

var url = null;
//打開新增窗口
function openAddDialog(){
    url = "save.php";
    $("#dialog0").dialog("setTitle","新增用戶").dialog("open");

}

//打開修改窗口
function openModifyDialog(){

    //編輯用戶的時候，只允許用戶勾選一條數據
    var rows = $("#grid0").datagrid("getSelections");

    if(rows.length != 1){
        $.messager.alert("系統提示","請勾選一條數據！");
        return;
    }

    //將勾選的數據填充到窗口中
    $("#form0").form("load",rows[0]);

    url = "save.php?id=" + rows[0].id;

    $("#dialog0").dialog("setTitle","編輯用戶").dialog("open");
    
}
 

打開save.php，加上如下代碼：

註意，因為ID是拼接在url後面的，所以是get方式，需要用$_GET去接受，不能用$_POST。

源碼獲取：https://www.jianshu.com/p/4977bd0073d5

【php增刪改查實例】第二十一節 - 用戶修改功能