asp.net- select control databind javascrip and c# with webmathod

  <script type="text/javascript">

        $(document).ready(function () {

            $(".divCreate").hide();

        });


        function CreateShow(div) {

            $(".divCreate").hide();

            $('#div' + div).show('slow');

            switch (div) {

                case "Today":

                    selectDataBind('ddlConBlock', 'Block');

                    break;

                case "Tommorow":

                    selectDataBind('ddlTomConBlock', 'Block');

                    break;

            }

        }


        function CreateHide(div) {

            $('#div' + div).hide('slow');

        }


        //select DataBind

        function selectDataBind(input, data) {

            var selObj = document.getElementById(input);

            var p_id = document.getElementById('<%=textProjectID.ClientID %>').value;

            var myData = JSON.stringify({ 'projectID': p_id, 'tableName': data });

            //alert(myData.projectID);

            $.ajax({

                url: "Read.aspx/SelectOptionList",

                type: "POST",

                data: myData,

                contentType: 'application/json; charset=utf-8',

                dataType: "json",

                success: function (response) {

                    //alert(response.d);

                    var raw_data = response.d;

                    var list = raw_data.split(',');

                    for (var i = 0; i < list.length; i++) {

                        var value = list[i].split(':');

                        var optionObj = document.createElement("option");

                        optionObj.value = value[0];

                        optionObj.text = value[1];

                        selObj.options.add(optionObj);

                    }

                },

                error: function (msg) {

                    alert("FALSE : " + msg);

                }

            });


        }


        function selectTargetDataBind(input, data, target_data, target_input) {

            var selObj = document.getElementById(input);

            var tarObj = document.getElementById(target_input);

            var data_id = selObj.value;

            if (data_id == "" || data_id == null || data_id == "공구/동별" || data_id == "공사별" || data_id == "공종별") {

                alert("다시 선택해주세요");

                selObj.focus();

                return false;

            }

            //기존 option 삭제

            for (var i = tarObj.length; i > 0; i--) {

                tarObj.remove(i);

            }

            var myData = JSON.stringify({ 'tableName': data, 'tableID': data_id, 'categoryName': target_data });

            $.ajax({

                url: "Read.aspx/SelectTergetOptionList",

                type: "POST",

                data: myData,

                contentType: 'application/json; charset=utf-8',

                dataType: "json",

                success: function (response) {

                    //alert(response.d);

                    if (response.d != "false") {

                        var raw_data = response.d;

                        var list = raw_data.split(',');

                        for (var i = 0; i < list.length; i++) {

                            var value = list[i].split(':');

                            var optionObj = document.createElement("option");

                            optionObj.value = value[0];

                            optionObj.text = value[1];

                            tarObj.options.add(optionObj);

                            tarObj.focus();

                        }

                    } else {

                        alert("서버측에러입니다. 다시시도하세요.");

                    }

                },

                error: function (msg) {

                    alert("FALSE : " + msg);

                }

            });

        }

    </script>


<html>

<table class="table table-sm">

                <thead>

                    <tr>

                        <th>

                            <h5 class="text-muted mb-0 mt-4"><strong>금일작업내용</strong></h5>

                        </th>

                        <th style="width: 100px; text-align: right;">

                            <a class="text-info" href="javascript:CreateShow('Today')"><span class="fas fa-2x fa-minus-circle"></span></a>

                        </th>

                    </tr>

                </thead>

            </table>

            <div class="container divCreate m-0 p-0" id="divToday">

                <div class="form-inline">

                    <label class="col-xl-2 justify-content-start">공 종</label>

                    <select id="ddlConBlock" class="form-control form-control-sm" onchange="selectTargetDataBind('ddlConBlock', 'Block', 'Type', 'ddlConType');">

                        <option>공구/동별</option>

                    </select>

                    <select id="ddlConType" class="form-control form-control-sm ml-1" onchange="selectTargetDataBind('ddlConType', 'Type', 'Detail', 'ddlConDetail');">

                        <option>공사별</option>

                    </select>

                    <select id="ddlConDetail" class="form-control form-control-sm ml-1">

                        <option>공종별</option>

                    </select>

                </div>

                <hr class="my-1" />

                <div class="form-inline">

                    <label class="col-2 justify-content-start">작 업 내 용</label>

                    <input type="text" class="form-control form-control-sm col-10" id="textTodayWorkDesc" runat="server" size="50" />

                </div>

                <hr class="my-1" />

                <div class="d-flex justify-content-center">

                    <asp:Button ID="ButtonTodayCreate" CssClass="btn btn-info btn-sm mx-2" OnClick="ButtonTodayCreate_Click" runat="server" Text="등록" />

                    <button type="button" class="btn btn-secondary btn-sm mx-2" onclick="CreateHide('Today');">취소</button>

                </div>

            </div>

            <table class="table table-sm" id="TableToday" runat="server"></table>


<c# code behind>

        [WebMethod]

        public static string SelectOptionList(string projectID, string tableName)

        {

            StringBuilder sb = new StringBuilder();

            KawooDB kawoo = new KawooDB();

            string query = String.Empty;

            string where = " WHERE [ProjectID]=" + projectID;

            switch(tableName)

            {

                case "Block":

                    query += "SELECT [ConstructionBlockID] AS 'ID', [Title] AS 'Name' FROM [ConstructionBlock]" + where;

                    break;

                case "Type":

                    query += "SELECT [ConstructionTypeID] AS 'ID', [Title] AS 'Name' FROM [ConstructionType]" + where;

                    break;

                case "Detail":

                    query += "SELECT [ConstructionDetailID] AS 'ID', [Title] AS 'Name' FROM [ConstructionDetail]" + where;

                    break;

            }


            try

            {

                DataTable dt = kawoo.DbDataTable(query);

                

                for (int i = 0; i < dt.Rows.Count; i++)

                {

                    sb.Append(dt.Rows[i]["ID"].ToString() + ":" + dt.Rows[i]["Name"].ToString());

                    if (i < dt.Rows.Count - 1)

                    {

                        sb.Append(",");

                    }

                }

                return sb.ToString();

            }catch(Exception ex)

            {

                return "에러 메시지 : " + ex.Message;

            }

        }

        [WebMethod]

        public static string SelectTergetOptionList(string tableName, string tableID, string categoryName)

        {

            StringBuilder sb = new StringBuilder();

            KawooDB kawoo = new KawooDB();

            string query = String.Empty;

            string where = " WHERE [Construction" + tableName + "ID]=" + tableID;

            switch (categoryName)

            {

                case "Block":

                    query += "SELECT [ConstructionBlockID] AS 'ID', [Title] AS 'Name' FROM [ConstructionBlock]" + where;

                    break;

                case "Type":

                    query += "SELECT [ConstructionTypeID] AS 'ID', [Title] AS 'Name' FROM [ConstructionType]" + where;

                    break;

                case "Detail":

                    query += "SELECT [ConstructionDetailID] AS 'ID', [Title] AS 'Name' FROM [ConstructionDetail]" + where;

                    break;

            }


            try

            {

                DataTable dt = kawoo.DbDataTable(query);


                if (dt.Rows.Count > 0)

                {


                    for (int i = 0; i < dt.Rows.Count; i++)

                    {

                        sb.Append(dt.Rows[i]["ID"].ToString() + ":" + dt.Rows[i]["Name"].ToString());

                        if (i < dt.Rows.Count - 1)

                        {

                            sb.Append(",");

                        }

                    }

                    return sb.ToString();

                }

                else

                {

                    return "false";

                }

            }

            catch (Exception ex)

            {

                return "false";

            }

        }

댓글

이 블로그의 인기 게시물

키스콘 건설업체 정보 서비스 (javascript, php)