Привязать строковые данные JSON к подробному представлению

Question

Я фактически передал в сценарий строку JSON и хотел бы отобразить ее в подробном представлении.

Вот так выглядит мой jquery

    function onBeforeClientInsert(record) {


    var eventtype = parseInt(record.<%= CEO.FieldEvaluator.GetEvaluatorByDId("EVENT_TYPE_ID").GetFieldDataFieldId()%>);
   var begindate = record.<%= CEO.FieldEvaluator.GetEvaluatorByDId("BeginDate").GetFieldDataFieldId()%>;
   var enddate = record.<%= CEO.FieldEvaluator.GetEvaluatorByDId("EndDate").GetFieldDataFieldId()%>;

     $.ajax({
            type: "POST", url: "Data.aspx/CheckInsertRecord",
            data: "{EventType:'" + eventtype + "',BeginDate:'" + begindate + "'," +
                   "EndDate:'" + enddate+"' }",
            contentType: "application/json; charset=utf-8", dataType: "json",
            success: function (msg) {
                 if(msg.d == "No duplicate"){

                 }
                 else{
                     alert(msg.d);
                     eval("var data = "+msg.d+";");
                     alert(data[0].BeginDate);
                     alert(data[0].EVENT_TYPE_ID);
                  }
                  var modal = document.getElementById('Div1');
        modal.style.display = '';
        modal.style.position = 'fixed';
        modal.style.zIndex = '100';
        modal.style.left = '30%';
        modal.style.top = '40%';

                   var screen = document.getElementById('modalScreen');
        screen.style.display = '';

            }

        });

modalScreen просто создает всплывающее окно. Это то, из чего состоит Div1

         <div style="display: none; background-color: White; width: 450px; height: 150px;"
                    id="Div1">
    <asp:Label ID="Label1" Text="HI" runat="server"></asp:Label>
   <asp:DetailsView ID="de" runat="server" AutoGenerateRows="True" Height="50px" Width="301px">
   <Fields>
   <asp:TemplateField>
   <ItemTemplate>
   <asp:Label ID="Label1" runat="server" Text='<%# Eval(data[0].EVENT_TYPE_ID) %>'></asp:Label>
   </ItemTemplate>
   </asp:TemplateField>
   </Fields>

    </asp:DetailsView>
    <input type="button" onclick="Hide()" value="OK" />
</div>

Это мой код:

     public static string CheckInsertRecord(String EventType, String BeginDate, String EndDate)
{
    NCDCPoint ncdc = new NCDCPoint();
    CEOSurveyDataContext CDC = new CEOSurveyDataContext();
    int et = Convert.ToInt32(EventType);
    CultureInfo provider = CultureInfo.InvariantCulture;
    DateTime b = Convert.ToDateTime(BeginDate);
    DateTime e = Convert.ToDateTime(EndDate);
    DetailsView a = new DetailsView();

      var query = (from n in CDC.NCDCPoints
                where n.EVENT_TYPE_ID == et && n.BeginDate == b && n.EndDate == e
                select new { 
                   n.EVENT_TYPE_ID,
              BeginDate =  n.BeginDate.ToString("yyyy-MM-dd",provider),
               EndDate = n.EndDate.ToString(),
                n.BeginLAT,
              BeginLONG =  n.BeginLONG,
                n.EndLAT,
                n.EndLONG});

   if (query.Any())
   {
       return new JavaScriptSerializer().Serialize(query.ToList());
   }
   else
   {
       return "No duplicate";
   }

}

Итак, я не могу получить доступ к переменной данных внутри Div1. Так, ребята, дайте мне знать, как я могу справиться с этим?

Более того, запрос, который я написал в коде, - это то, что мне нужно отобразить? Итак, вы можете выяснить мне другой способ сделать это?

Answer 1

Если все, что вы пытаетесь сделать, это отображать некоторую информацию через AJAX, вам не нужно использовать подробное представление, которое является серверным элементом управления. Если вы действительно хотите использовать это, вам нужно использовать панель обновления и частичный постбэк для заполнения элемента управления. Вы лучше, чем вы идете, хотя.

Сначала ваш HTML должен выглядеть следующим образом:

<div id="Div1" style="display: none; background-color: White; width: 450px; height: 150px;position:fixed;zIndex:100;left30%;top40%;>
    <div>Begin Date:<span id="beginDate"></span></div>
    <div>EventTypeID:<span id="eventTypeID"></span></div> 
</div>

Нет причин не полностью стилизовать Div1, который я вижу

Ваш jQuery должен быть больше похож на:

    function onBeforeClientInsert(record) {  
        var eventtype = parseInt(record.<%= CEO.FieldEvaluator.GetEvaluatorByDId("EVENT_TYPE_ID").GetFieldDataFieldId()%>);
        var begindate = record.<%= CEO.FieldEvaluator.GetEvaluatorByDId("BeginDate").GetFieldDataFieldId()%>;
        var enddate = record.<%= CEO.FieldEvaluator.GetEvaluatorByDId("EndDate").GetFieldDataFieldId()%>;

         $.ajax({
            type: "POST", url: "Data.aspx/CheckInsertRecord",
            data: "{EventType:'" + eventtype + "',BeginDate:'" + begindate + "'," +
                   "EndDate:'" + enddate+"' }",
            contentType: "application/json; charset=utf-8", dataType: "json",
            success: function (msg) {
                 if(msg.d == "No duplicate"){

                 }
                 else{
                     alert(msg.d);
                     var data  = jQuery.parseJSON(msg.d); //safer than eval
                     alert(data[0].BeginDate);
                     alert(data[0].EVENT_TYPE_ID);
                  }

                  //Set the values
                  $("#beginDate").html(data[0].BeginDate);
                  $("#eventTypeID").html(data[0].EVENT_TYPE_ID);

                  //Show Divs
                  $("#Div1").show();
                  $("#modalScreen").show();

            }

        });

Судя по всему, вы должны немного почитать о jQuery. Взгляните на селекторы , CSS , Эффекты и AJAX .