PHP+jQuery實現雙擊修改table表格

来源:https://www.cnblogs.com/wangziyue/archive/2019/02/28/10449541.html
-Advertisement-
Play Games

//雙擊觸發事件 $("tbody>tr>td").dblclick(function(){ //獲取到 當前 input 下的元素(原值) window.olds = $(this).children('input').val(); if(olds==undefined) { r... ...


<td signs="name">
    <input type="text" disabled="disabled" readonly="readonly" value="{$res.section}" >
</td>
 //雙擊觸發事件
    $("tbody>tr>td").dblclick(function(){
        //獲取到 當前 input 下的元素(原值)
        window.olds = $(this).children('input').val();
        if(olds==undefined)
        {
            return false;
        }
        var signs = $(this).attr('signs'); //獲取屬性值(這些值方便php後臺的操作)
//        console.log(signs);
        var user_id = $(this).parent().attr("id"); //接受當前點擊的ID(tr里的id)
//        console.log(user_id);
        //雙擊之後可以修改
        $(this).find('input').attr("disabled",false);
        $(this).find('input').attr("readonly",false);
        $(this).find('input').css("border",'1px solid deepskyblue');
        $(this).find('input').attr('id', signs + "_" + user_id);  //方便下麵失去焦點事件 找ID(沒有這個無法定位到tr裡面的id屬性)
        //迴圈這些值從而判斷是修改數據的類型,對一些特殊類型的數據進行特殊處理
        switch(signs){
            case 'name':
                $("#" + signs + "_" + user_id).focus().on("blur",function(){
                    var content = $(this).val();
//                    console.log(content);
                    if(content!=olds)  //與原值不同則傳到後臺
                    {
                        // alert(user_id);alert(signs);alert(content);
                        /*
                        通過getJSON將數據傳輸到後臺
                        USER_ID
                        SIGNS
                        CONTENT
                        */
                        $.ajax({
                            type:"post",    // 請求類型
                            url:"{:url('Sections/update')}",    // 請求URL
                            data:{id:user_id,val:content},    // 請求參數 即是 在Servlet中 request.getParement();可以得到的字元串
                            dataType:"json",    // 數據返回類型
                            cache:false, // 是否緩存
                            async:true,    // 預設為true 非同步請求
                            success:function(result){    // 成功返回的結果(響應)
                                console.info(result);
                                if(result){
//                                    alert('22213');
                                }else{
//                                    alert('1111');
                                }
                            }
                        });
                    }
                    $(this).attr('disabled', 'disabled');
                    $(this).attr('readonly', 'readonly');
                    $(this).css('border', '0');
                    $(this).css('background', '#fff');
                    $(this).css('text-align', 'center');
                });
                break;
        }
    })
    public function update()
    {
        $datas=input('post.');
        $id = $datas['id'];
        $name = $datas['val'];
        $res = $this->section->updates($datas);
        echo json_encode($res);

    }
/**
* 修改
*/
public function updates($data)
{

$Section = new Section;
$res = $Section->save([
'section' => $data['val'],
],['id' => $data['id']]);

return $res;
}




 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 一、Kafka概述 1.Kafka是一個分散式流媒體平臺,它有三個關鍵功能: (1)發佈和訂閱記錄流,類似於消息隊列或企業消息傳遞系統; (2)以容錯的持久方式存儲記錄流; (3)記錄發送時處理流。 2.Kafka通常應用的兩大類應用 (1)構建在系統或應用程式之間的可靠獲取數據的實時流數據管道; ...
  • 筆記記錄自林曉斌(丁奇)老師的《MySQL實戰45講》 5) --深入淺出索引(下) 這次的筆記從一個簡單的查詢開始: 建表語句是這樣的 如果要執行 select * from T where k between 3 and 5這條語句,需要執行幾次搜索操作呢,會掃描多少行呢?由上面的建表及初始化語 ...
  • 禁用 1* select LAST_DATE,NEXT_DATE from dba_jobs where job=45SQL> begin 2 dbms_job.broken(45,true); 3 end; 4 / PL/SQL procedure successfully completed. ...
  • eclipse中寫入sql插入語句時,navicat中顯示的出現亂碼(???)。 在修改eclipse工作空間編碼、navicate中的資料庫編碼、mysql中my.ini中的配置之後還是出現亂碼。 然後把mysql、navicate全部卸載,下載新版本。 再重新配置mysql中,因為新建data里 ...
  • [20190227]簡單探究tab$的bojb#欄位.txt--//上午做了刪除tab$表,其對應索引i_tab1的恢復,我一直以為這個索引會很大,沒有想到在我的測試環境僅僅139個鍵值.--//查看/u01/app/oracle/product/11.2.0.4/dbhome_1/rdbms/ad ...
  • 大數據文摘出品 來源:Medium 編譯:李雷、橡樹_Hiangsug 文章解釋了轉型為數據科學家的原因,整理了數據科學家應該掌握的技能,著重介紹了從數據分析師轉型為數據科學家的具體方法。 如何從數據分析師華麗轉型,成為一名數據科學家?好比“把大象裝進冰箱”,成為“數據科學家”僅需簡單三步: 1. ...
  • 在學習菜鳥教程里的MySQL教程時,對左右連接的結果有點不解。 其中有如下兩個表: 執行右連接語句後: 得到的結果是: 我對這個結果感到很奇怪,右連接是會返回右表的所有行,不管有無匹配,但右表runoob_author明明有Google這個數據,為什麼會是NULL。 試著把所有列列印出來: 可以看到 ...
  • 任何系統都需要提供監控功能,否則在運行期間發生一些異常時,我們將會束手無策。也許有人說,可以增加日誌來解決這個問題。日誌只能解決你的程式邏輯在運行期的監控,進而發現Bug,以及提供對業務有幫助的調試信息。當你的JVM進程奔潰或者程式響應速度很慢時,這些日誌將毫無用處。好在JVM提供了jstat、js... ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...