修改（form提交）-CSDN博客

（修改保存删除）

//项目信息 保存 修改
<form  action="{{ route('updateProject') }}" method="post" id="updatePro">
       {{ csrf_field() }}
       <span class="spanColor" style="width:100%;text-align: center;">项目信息</span>
    <div class="projectDesc">        项目名称<input id="projectName" name="name" type="text" class="ipu" readonly autocomplete="off">          
        开始里程<input id="projectFrom" type="text" name="from" class="ipu" readonly autocomplete="off">  
        结束里程<input id="projectEnd" type="text" name="end" class="ipu" readonly autocomplete="off">  
        创建时间<input id="projectStart" type="text" class="ipu" readonly autocomplete="off">                    
        状态<select name="is_finish" id="projectStatus" disabled>
               <option value="0">未完成</option>
               <option value="1">已完成</option>
             </select>
     </div>
     项目描述<textarea id="projectDesc" name="desc" cols="40" rows="9" readonly></textarea>
            <button id="proDescSub" class="project_btn save_btn" type="button" onclick="formSub('#updatePro')" disabled>保存</button>
            <button type="button" class="project_btn" onclick="redactPro()">编辑</button>
</form>

//将数据显示在页面上

$(document).ready(function () {    projectTable();
});
//保存按钮执行
function formSub(id) {
    $(id).submit()
}function projectTable() {
    var proContent=@json($project_info);

    console.log(proContent);

    $("#projectName").val(proContent.name);

    $("#projectFrom").val(proContent.from);

    $("#projectEnd").val(proContent.end);

    $("#projectStatus").val(proContent.is_finish);

    $("#projectStart").val(proContent.created_at);

    $("#projectDesc").val(proContent.desc);
}
//执行此方法内容可编辑
function redactPro() {    $(".projectDesc input").attr("readonly",false);
    $("#projectDesc").attr("readonly",false);
    $("#projectStatus").attr("disabled",false);
    $("#proDescSub").attr("disabled",false);
}复制代码

车站列表

//车站显示区
<div style="height:auto;">
    <span class="spanColor spanName">车站列表</span>
    <div id="stationList" class="projectDiv"></div>

    <div class="projectDiv">
        <button data-toggle="modal" data-target="#stationAdd" class="project_btn">添加</button>
        <button onclick="edit(this)" class="project_btn">编辑</button>
    </div>
</div>
//添加模态框
<div id="mytab" class="modal-body">
          <span>车站名称：</span>
          <input id="addStaName" type="text" name="name">
          <span>车站位置：</span>
          <input type="text" class="searchInput1" id="fromMileage1" placeholder="公里">  +
          <input type="text" class="searchInput1" id="fromMileage2" placeholder="米" >  
</div>
          <button type="button" class="btn cyy_add_user" data-dismiss="modal">关闭</button>
          <button type="button" onclick="addStation()" class="btn cyy_add_user">确认添加</button>
$(document).ready(function () {
    stationList() //展示页面
});//里程转换
//大小里程相加成一个数据传给后台window.transformMileage=function (num1,num2) {
    var sum=Number(num1)*1000+Number(num2);
    return sum;
};
//里程显示方式
window.mileageShow=function (num) {

    var mileage= "";

    if(num > 0){
        var meter=Math.floor(num%1000),km=Math.floor(num/1000);

        if( meter>=10 && meter<100){
            meter="0"+meter;
        }else if(meter<10){
            meter="00"+meter;
        }

        mileage="<b>DK </b>"+km+" + "+meter;
    }


    return mileage;

};
//确认添加
function addStation() {
    var pos=transformMileage($("#fromMileage1").val(),$("#fromMileage2").val());    $.ajax({
        type: "POST",
        url: "/sAdmin/project/add_station",
        data: {
            "name":$("#addStaName").val(),
            "pos":pos,
            '_token':'{{ csrf_token() }}'
        },
        success: function (json) {
            console.log(json);
            alert(json.msg);
            if(json.status===0){
                location.reload(window.location.href);
            }
        },
        error: function () {
            console.log("请求失败");
        }
    })
}//车站展示在页面上
function stationList() {
    var sta=@json($stations);
    var html="";
    console.log(sta);
    for(var i=0,len=sta.length;i<len;i++){
        html+="<div class='stationWord cyy_stationWord'>" +
                "<b class='absL' style='top:-15px;right:-5px' onclick='delSub(\"/sAdmin/project/delete_station\","+sta[i].id+")'>X(删除)</b>" +
                "<span class='VerticalName'>"+sta[i].name+"</span> <br> " +
                "<span class='posSpan'>"+mileageShow(sta[i].pos)+"</span>" +
              "</div>"
    }
    $("#stationList").html(html);
}
//编辑封装方法
function edit(that) {
    $(that).parent().parent().find(".absL").slideToggle();
    if($(that).html()=="完成") {
        $(that).html("编辑");
    }else{
        $(that).html("完成");
    }
}
//删除函数封装
function delSub(url,id) {
    if(window.confirm('请确认要删除?! 删除后不可恢复')){
        $.post(url,
            {
                "id":id,
                '_token':'{{ csrf_token() }}'
            },
            function(json){
                alert(json.msg);
                location.reload(window.location.href);
            });
    }else{
        console.log("取消删除");
    }
}复制代码

线别

//线别显示区
<div style="height:auto;">
    <span class="spanColor spanName">线别</span>
    <div class="projectDiv"></div>
    <div class="projectDiv">
        <button onclick="addLine()" data-toggle="modal" data-target="#lineAdd" class="project_btn">添加</button>
        <button onclick="edit(this)" class="project_btn">编辑</button>
    </div>
</div>
//添加模态框
<form action="{{ route('addProjectLine') }}" method="post">    {{ csrf_field() }}
    <div id="mytab" class="modal-body">
        <div class="cyy_user_ul">
                <span class="left_b" style="width: 90px">线别名称：</span>
                <select name="line_id" id="lineAll"></select>   
        </div>
    </div>
            <button type="button" data-dismiss="modal">关闭</button>
            <button >确认添加</button>
    </div>
</form>
//线别展示js
$(document).ready(function () {
    lineList();
});
function lineList() {
    var line=@json($project_lines);
    var btn="";
    for(var i=0,len=line.length;i<len;i++){
        btn+="<div class='relV'>" +
                "<button>"+line[i].line_name+"</button>" +
                "<b class='absL' onclick='delSub(\"/sAdmin/project/delete_project_line\","+line[i].id+")'>x</b>" +
            "</div>"
    }

    $("#lineList").append(btn);
}
//添加
function addLine() {
    $.get("/sAdmin/project/get_line",
        function(json){
            var html="",data=json.data;
            for(var i=0,len=data.length;i<len;i++){
                html+="<option value='"+data[i].id+"'>"+data[i].name+"</option>"
            }

            $("#lineAll").html(html);

        });

}
//编辑封装方法
function edit(that) {
    $(that).parent().parent().find(".absL").slideToggle();
    if($(that).html()=="完成") {
        $(that).html("编辑");
    }else{
        $(that).html("完成");
    }
}
//删除函数封装
function delSub(url,id) {
    if(window.confirm('请确认要删除?! 删除后不可恢复')){
        $.post(url,
            {
                "id":id,
                '_token':'{{ csrf_token() }}'
            },
            function(json){
                alert(json.msg);
                location.reload(window.location.href);
            });
    }else{
        console.log("取消删除");
    }
}复制代码

类别

//类别显示区
<div style="height:auto;">
    <span class="spanColor spanName">类别</span>
    <div class="projectDiv" id="typeList"></div>

    <div class="projectDiv">
        <button onclick="addType()" data-toggle="modal" data-target="#typeAdd" class="project_btn">添加</button>
        <button onclick="del(this)" class="project_btn">编辑</button>
    </div>
</div>
//添加模态框
<form action="{{ route('addProjectKind') }}" method="post">
    {{ csrf_field() }}
   
          <span>类别名称：</span>
          <select name="kind_id" id="typeAll"></select>
          <span>注释说明：</span>
          <textarea name="explain" cols="30" rows="10"></textarea>
          <span>类别编号：</span>
                <label>
                    <input type="radio" name="form_for_kind" value="5" checked>
                    执行区及施工作业许可证
                </label>
                </br>
                <label>
                    <input type="radio" name="form_for_kind" value="6">
                    进场作业许可证
                </label>
            </div>
        </div>
    </div>
    <div class="modal-footer cyy_modal_footer">
        <p style="text-align: center">
            <button type="button" class="btn cyy_add_user" data-dismiss="modal">关闭</button>
            <button class="btn cyy_add_user">确认添加</button>
        </p>

    </div>
</form>
//展示数据
$(document).ready(function () {
    typeList();
});
function addType() {
    $.get("/sAdmin/project/get_kind",
        function(json){
            var html="",data=json.data;
            for(var i=0,len=data.length;i<len;i++){
                html+="<option value='"+data[i].id+"'>"+data[i].name+"</option>"
            }

            $("#typeAll").html(html);

        });
}

function typeList() {
    var type=@json($project_kinds);

    console.log(type);

    var btn="";
    for(var i=0,len=type.length;i<len;i++){
        btn+="<div class='relV'>" +
            "<button data-id='"+type[i].form_for_kind+"'>"+type[i].kind_name+"</button>" +
            "<b class='absL' onclick='delSub(\"/sAdmin/project/delete_project_kind\","+type[i].id+")'>x</b>" +
            "</div>"
    }

    $("#typeList").append(btn);
}

function edit(that) {
    $(that).parent().parent().find(".absL").slideToggle();
    if($(that).html()=="完成") {
        $(that).html("编辑");
    }else{
        $(that).html("完成");
    }
}

function delSub(url,id) {
    if(window.confirm('请确认要删除?! 删除后不可恢复')){
        $.post(url,
            {
                "id":id,
                '_token':'{{ csrf_token() }}'
            },
            function(json){
                alert(json.msg);
                location.reload(window.location.href);
            });
    }else{
        console.log("取消删除");
    }

}


复制代码