動態下拉列表及其在表格行中使用JavaScript的選項？

如何使用javascript動態地在表格行中添加下拉列表及其選項。需要調用的功能是Onclick of按鈕。動態下拉列表及其在表格行中使用JavaScript的選項？

function addRow() {                 
     @{ 

      Model.lstfcDayConfig.Add(new NewFCDayConfig());    
     } 
     var index = $("#tbFCDays").children("tr").length;                  
     var indexCell = "<td style='display:none'><input name='lstfcDayConfig.Index' type='hidden' value='" + index + "' /></td>"; 
     var titleCell = "<td><input id='lstfcDayConfig" + index + "__Title' name='lstfcDayConfig[" + index + "].Description' type='text' value='' /></td>"; 
     var startDateTimeCell = "<td><input id='lstfcDayConfig" + index + "__StartTime' name='lstfcDayConfig[" + index + "].StartDateTime' type='date' value='' /></td>"; 
     var EndDateTimeCell = "<td><input id='lstfcDayConfig" + index + "__EndTime' name='lstfcDayConfig[" + index + "].EndDateTime' type='date' value='' /></td>"; 
     var removeCell = "<td><input id='btnAddDay' type='button' value='Remove' onclick='removeRow(" + index + ");' /></td>"; 

     var newRow = "<tr id='trFCConfigRow" + index + "'>" + 
     indexCell + titleCell + startDateTimeCell + EndDateTimeCell + removeCell + "</tr>"; 
     $("#tbFCDays").append(newRow); 
    }

我曾嘗試使用上面的代碼中添加文本框，但我不知道如何添加下拉使用選擇框，我可以在相同的代碼添加下拉，但是當我需要添加的選項，選擇需問題就來了從ViewBag添加

來源

2015-05-27 Shailesh Jain

你能舉一個你已經試過的例子嗎？這不是真的讓人們爲你編寫代碼的地方，但是如果你有我們可以構建的東西，我們可以幫助你指出正確的方向，或者告訴你代碼中可能存在問題的地方。 – gjanden

你試過了什麼？ – Prasanga

我終於明白了我自己。在這裏發佈誰可能需要它...

function addRow() {                 
     @{ 

      Model.lstObjEvtNotifyCfgDetail.Add(new NewEventNotifyCfgDetail());    
     } 


    var index = $("#tbEvtCfg").children("tr").length; 


    var indexCell = "<td style='display:none'><input name='lstObjEvtNotifyCfgDetail.Index' type='hidden' value='" + index + "' /></td>"; 
    //var titleCell = "<td><input id='lstObjEvtNotifyCfgDetail" + index + "__Title' name='lstObjEvtNotifyCfgDetail[" + index + "].EventCode' type='text' value='' /></td>"; 

    //var startDateTimeCell = "<td><input id='lstfcDayConfig" + index + "__StartTime' name='lstfcDayConfig[" + index + "].StartDateTime' type='date' value='' /></td>"; 
    //var EndDateTimeCell = "<td><input id='lstfcDayConfig" + index + "__EndTime' name='lstfcDayConfig[" + index + "].EndDateTime' type='date' value='' /></td>"; 
    //var removeCell = "<td><input id='btnAddDay' type='button' value='Remove' onclick='removeRow(" + index + ");' /></td>"; 

    var EventCodeControl="<td>"+ "<select name='lstObjEvtNotifyCfgDetail[" + index + "].EventCode' value=''>" ; 


    @foreach (SelectListItem sli in (List<SelectListItem>)ViewBag.EventCodeList) 
    { 
     @:EventCodeControl = EventCodeControl + "<Option [email protected](sli.Value)>" + '@sli.Text' + "</Option>"; 
    } 
     EventCodeControl = EventCodeControl + "</select></td>"; 

    var NotifyHanControl = "<td>" + "<input type='checkbox' name='lstObjEvtNotifyCfgDetail[" + index + "].IsNotifyHAN'>" + "</td>"; 
    var NotifyWanControl = "<td>" + "<input type='checkbox' name='lstObjEvtNotifyCfgDetail[" + index + "].IsNotifyWan'>" + "</td>"; 
    var DiscSupplyControl = "<td>" + "<input type='checkbox' name='lstObjEvtNotifyCfgDetail[" + index + "].IsDisconnectSupply'>" + "</td>"; 

    var newRow = "<tr id='trFCConfigRow" + index + "'>" + 
    indexCell + EventCodeControl +NotifyHanControl+ NotifyWanControl+DiscSupplyControl+"</tr>"; 
    $("#tbEvtCfg").append(newRow); 
    }

快樂編碼!!!!!

來源

2015-05-27 12:29:24

動態下拉列表及其在表格行中使用JavaScript的選項？

回答

相關問題