使用javascript

Question

我用它的id生成动态html。您可以看到动态生成的HTML的以下链接。

Dymanic Generated HTML

所以为了保存这个，我需要一些关于如何在javascript中保存它的建议。我尝试了HTML的其他字段..

＆＃13;

＆＃13;

function SaveNPEDetails() {

    var DashboardFields = {};

    if ($('#ddlFiberised').val() == '--Select--' || $('#ddlFiberised').val() == null) {
        alert('Please select FIBERISED');
        return false;
    }
    else {
        DashboardFields.NPEFiberised = $('#ddlFiberised').val();
    }

    if ($('#txtNoFDPSite').val() == '' || $('#txtNoFDPSite').val() == null) {
        alert('Please add NO. OF FDP AT SITE');
        return false;
    }
    else {
        DashboardFields.NoOfFDPatSite = $('#txtNoFDPSite').val();
    }

    if ($('#txtNoOfRoutesTerAtFDP').val() == '' || $('#txtNoOfRoutesTerAtFDP').val() == null) {
        alert('Please add NO. OF ROUTES TERMINATED AT FDP');
        return false;
    }
    else {
        DashboardFields.NoOfRoutesTermAtFDP = $('#txtNoOfRoutesTerAtFDP').val();
    }
// Need to write saving logic for dynamic generated html here. 
    $.ajax({
        type: "POST",
        url: "DashboardData.aspx/UpdateNPEData",
        data: JSON.stringify({ DashboardFields: DashboardFields }),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            alert(response.d);
        },
        error: function (response) {
            alert('Something went wrong..!!');
        }
    });

}

＆＃13;

＆＃13;

＆＃13;

Answer 1

根据我们的讨论，您可以尝试类似

的内容

function SaveNPEDetails() { 
        var data = []; 
        var DashboardFields = {}; 

        if ($('#ddlFiberised').val() == '--Select--' || $('#ddlFiberised').val() == null) { 
        alert('Please select FIBERISED'); 
        return false; 
        } 
        else { 
        DashboardFields.NPEFiberised = $('#ddlFiberised').val(); 
        } 

        if ($('#txtNoFDPSite').val() == '' || $('#txtNoFDPSite').val() == null) { 
        alert('Please add NO. OF FDP AT SITE'); 
        return false; 
        } 
        else { 
        DashboardFields.NoOfFDPatSite = $('#txtNoFDPSite').val(); 
        } 

        if ($('#txtNoOfRoutesTerAtFDP').val() == '' || $('#txtNoOfRoutesTerAtFDP').val() == null) { 
        alert('Please add NO. OF ROUTES TERMINATED AT FDP'); 
        return false; 
        } 
        else { 
        DashboardFields.NoOfRoutesTermAtFDP = $('#txtNoOfRoutesTerAtFDP').val(); 
        } 



        var chs = $("#dvNPEAddData").children(".addNPEData") 

        for (var i = 0; i < chs.length; i++) { 
            var d = {}; 
            var ch = chs[i]; 
            var val = $(ch).find("input[name='TerRouteName']").val(); 
            d[$(ch).find("input[name='TerRouteName']").attr("name")] = val; 

            val = $(ch).find("select[name='CableType']").val(); 
            d[$(ch).find("select[name='CableType']").attr("name")] = val; 

            val = $(ch).find("select[name='CableSize']").val(); 
            d[$(ch).find("select[name='CableSize']").attr("name")] = val; 


            val = $(ch).find("input[name='NoLiveFibre']").val(); 
            d[$(ch).find("input[name='NoLiveFibre']").attr("name")] = val; 

            data.push(d); 
        } 

        var d = JSON.stringify(data);

        $.ajax({ 

             type: "POST", 
            url: "DashboardData.aspx/UpdateNPEData", 
            data: JSON.stringify({ DashboardFields: DashboardFields , myJsonXML : d}), 
            contentType: "application/json; charset=utf-8", 
            dataType: "json", 
            success: function (response) { 
            alert(response.d); 
            }, 
            error: function (response) { 
            alert('Something went wrong..!!'); 
            } 
        }); 

}

Answer 2

在小提琴中使用你的例子我做了以下

$('#submit').click(function() {
   var DashboardFields = {},
   status = true;

   $.each($('input[type="text"]'), function(i, v) {
       var id = $(v).attr('id');
       if ($(v).val() == '') {
          alert(id + ' field is empty');
          status = false;
       } else {
          DashboardFields[id] = $(v).val();
       }
   });

   $.each($('select'), function(i, v) {
       var id = $(v).attr('id');
       if ($(v).val() == '--Select--' || $(v).val() == null) {
            alert(id + ' select is empty');
            status = false;
       } else {
            DashboardFields[id] = $(v).val();
       }
   });
   if(!status){
      alert('you have empty fields');
   } else {
      console.log(DashboardFields); //Here should be your Ajax Call
   }  
});

JsFiddle

我已经将您的示例与ID一起使用并创建了一个过滤器，以便动态获取不是ID的字段，我使用ID来映射DashboardFields对象，但我强烈建议使用name或其他data-参数，然后更改jQuery代码（带var id=$(v).attr('id')的行）

希望这有助于你