Динамический список данных в динамическом повторителе (Asp.Net )

#c# #asp.net

#c# #asp.net

Вопрос:

В моем проекте я уже некоторое время кое-что пробовал. Пользователь должен выбрать группу из списка select. Эта кнопка добавления запускает asp repeater, чтобы я мог перечислять группы. В строке группы есть 2 кнопки. Правый удаляет группу, а левый открывает динамические дивы. (Как вы можете видеть) Есть некоторые работы Javascript, поэтому я устанавливаю идентификаторы динамически. Пока все в порядке.Теперь, если пользователь хочет проверить фиксированные вопросы, мне нужно показать вопросы, которые в этой группе. И пользователь должен иметь возможность динамически добавлять вопрос в группу. Я пытался использовать GridView, но не смог справиться. Итак, какой-нибудь совет?

Вот что я хочу сделать:введите описание изображения здесь

 <ul>
     <asp:Repeater ID="GroupRepeater" runat="server">
         <ItemTemplate>                 
             <li class="groupli">
                 <div style="width:100%; float:left; margin-top:2%;">
                     <h3 style="display:block; float:left; width:auto;"><%# Container.ItemIndex 1 %>.<%# Eval("QuestGroup")%></h3>                         
                 <asp:Button CssClass="GroupLiButtonD" OnClick="RemoveGroup" CommandArgument='<%# Eval("QuestGroup") %>' ID="DeleteGroupBtn" runat="server"/>                     
                 <button type="button" onclick="ShowQuestArea('<%# Container.ItemIndex 1 %>_div')" class="GroupLiButtonA"></button> 
                 </div>
                 <div id='<%# Container.ItemIndex 1 %>_div' style="width:100%; margin-left:3%; float:left; display:none;">
                     <div class="questarea"> 
                         <div style="width:100%; margin-top:1%;">
                             <h4 style="display:block; float:left; width:200px;">Add Fixed Question</h4>                                
                             <input name='check_<%# Container.ItemIndex 1 %>' id='fixcheck_<%# Container.ItemIndex 1 %>' onchange="FixedCheck('fixcheck_<%# Container.ItemIndex 1 %>','<%# Container.ItemIndex 1 %>')" type="radio" />
                         </div> 
                         <div id="fixarea_<%# Container.ItemIndex 1 %>" class="subarea"> <%--fixedquestion view start tag--%>

                         </div>  <%--fixedquestion view end tag--%>                          
                         <div style="width:100%; margin-top:1%;">
                             <h4 style="display:block; float:left; width:200px;">Add Random Question</h4>
                         <input name='check_<%# Container.ItemIndex 1 %>' id='randomcheck_<%# Container.ItemIndex 1 %>' onchange="RandomCheck('randomcheck_<%# Container.ItemIndex 1 %>','<%# Container.ItemIndex 1 %>')" type="radio" />
                             <div id="randomarea_<%# Container.ItemIndex 1 %>" class="subarea">
                                 <div style="margin-top:1%;">
                                     <p style="color:black; float:left;">Number of Random Questions:</p><input type="number" max="20" min="0" style="width:20px; float:left;" />
                                     <button>Add</button>
                                 </div>                                 
                             </div>
                         </div>                        
                 </div>                         
                     </div>                                                                                 
              </li>
         </ItemTemplate>
     </asp:Repeater>
         </ul
  

Мой код может показаться сложным. Я добавил изображение. Так что вы можете игнорировать мой код для дачи советов. Спасибо.

Ответ №1:

Возможно, немного jquery и некоторые вызовы ajax помогут.

Вы можете добавить тот же класс и атрибут data-groupid к переключателям «фиксированный ответ».

Допустим, идентификатор групповых вопросов — resultlist, и это элемент ul.

Затем вы обработаете щелчок, чтобы загрузить вопросы с помощью ajax

 $(".yourclass").on"click", function (e) { 
    var groupid=$(this).data("groupid");
    //get the questions
    $.ajax({
       type: 'POST',
       contentType: "application/json; charset=iso-8859-7",
       url: 'yourpage.aspx/yourmethod',
       data: "{'group':'"   groupid  "'}",
       async: false,
       error: function (xhr) {console.log(xhr.responseText);},
       success: function (response) {
              //Query the jQuery object for the values
              var items = response.d;
              if (items == null) {
                $('#resultlist').empty();
                $('#resultlist').append("<li> no questions... </li>");
              }
              else {
                var fragment = "";
                $.each(items, function (index, val) {
                var theQuestion = val.theQuestion;
                var theCode = val.theCode;
                fragment  = "<li data-qustionid='" theCode "' class='question'>" theQuestion "</li>";});
                $('#resultlist').empty();
                $("#resultlist").append(fragment);
              }
     });

  }); 
  

в ваш файл .cs вы добавите новый веб-метод, который будет получать вопросы группы

 [WebMethod]
  public static List<Results> yourmethod(string text, string phone, string type)
        {
            List<Results> result = new List<Results>();
            DataTable question = getQuestions();
          if(question!=null){
            foreach (DataRow rw in autocomlete.Rows)
            {
              result.Add(new Results { theQuestion = rw[0].ToString(), 
              theCode = rw[3].ToString() });
            }
            }
            return resu<
        }
  

и аналогичным образом вы будете обрабатывать щелчок по классу question, который по щелчку получит data-questionid и обновит его в базе данных. Вы можете добавить дополнительные поля, которые вам нужны, в атрибуты данных (ссылка здесь) Подробнее о ajax здесь