如何从C＃中的代码隐藏创建AjaxToolKit控件（评级）？

Question

我正在创建从代码隐藏，如文本框，复选框列表，radiobuttonlist等等dinamically控制，并将它们添加到中继器内的占位符，以创建一个动态的调查，从模板 - 用户 - 我想从代码隐藏创建调查的问题，但是如果有任何其他方式来动态创建控件，您可以指导我一个特定的主题或向我展示一个代码示例吗？

我的想法是这样..

AjaxControlToolkit.Rating rateThing = new AjaxControlToolkit.Rating(); 
        rateThing.CurrentRating = 3; 
        rateThing.MaxRating = 5; 
        rateThing.StarCssClass = "ratingStar"; 
        rateThing.WaitingStarCssClass = "savedRatingStar"; 
        rateThing.FilledStarCssClass = "filledRatingStar"; 
        rateThing.EmptyStarCssClass = "emptyRatingStar"; 
        rateThing.ID = "rateThing" + IdPregunta.Value; 
        rateThing.Visible = true; 

        placeholder.Controls.Add(rateThing); 

，但它并未使...

P.D.我已经添加了例如需要在CSS创建控件的明星图像，试图阅读评级MS与this rating ajaxtoolkit stuff，并没有成功EDITED其他的东西:(

：从来没有想通了，所以我选择一个单选按钮列表用于创建隐藏代码控制，然后使用CSS和JS/JQuery的用于创建等级的真正pseudocontrol

您可以使用此作为代码隐藏

指南10

RadioButtonList rblEscala = new RadioButtonList(); 
    rblEscala.ID = "rblRes" + IdPregunta.Value; 
    rblEscala.CssClass = "input-sm form-control col-sm-12 star-cb-group"; 
    rblEscala.Style.Add("height", "auto !important;"); 
    for (int i = 5; i >= 1; i--) 
    { 
     rblEscala.Items.Add(new ListItem("☆", i.ToString())); 
    } 
    rblEscala.RepeatDirection = RepeatDirection.Horizontal; 

    placeholder.Controls.Add(rblEscala); 

在前面使用这个链接作为参考：https://codepen.io/anon/pen/PKxQYY

Answer 1

我会释放我的代码，所以你可以使用它作为您的自定义评级 呵呵呵

对于基地代码隐藏尝试使用一个占位符，并使用此：

    RadioButtonList rblEscala = new RadioButtonList(); 
        rblEscala.ID = "rblRes"; 
        rblEscala.CssClass = "star-cb-group"; 
        rblEscala.Style.Add("height", "auto !important;"); 
        for (int i = 5; i >= 1; i--) 
        { 
         //rblEscala.Items.Add(new ListItem(i.ToString(), i.ToString())); 
         rblEscala.Items.Add(new ListItem("☆", i.ToString())); 
        } 
        rblEscala.RepeatDirection = RepeatDirection.Horizontal; 

        placeholder.Controls.Add(rblEscala); 

为CSS使用此：

.star-cb-group { 
     /* remove inline-block whitespace */ 
     font-size: 0; 
     /* flip the order so we can use the + and ~ combinators */ 
     unicode-bidi: bidi-override; 
     direction: rtl; 
     /* the hidden clearer */ 
    } 

     .star-cb-group tbody { 
      float: left; 
     } 

     .star-cb-group * { 
      font-size: 2.5rem; 
     } 

     .star-cb-group input { 
      display: none; 
      background: none; 
     } 

     .star-cb-group label { 
      background: none !important; 
      padding-left: 5px !important; 
      height: auto !important; 
     } 

     .star-cb-group input + label { 
      color: #888; 
     } 

     .star-cb-group input:checked + label { 
      color: #e52; 
     } 

对于JS/jQuery的我加了这一点：

 try { 
      $(".star-cb-group input").change(function() { 
       //$(this).next().text("★"); 
       var inputs = $(this).parent().parent().children().children("input"); 
       var bandera = false; 
       inputs.each(function() { 
        if ($(this).is(':checked') || bandera) { 
         $(this).next().text("★"); 
         $(this).next().css("color", "#e52"); 
         $(this).next().css("font-weight", "Bold !important"); 
         bandera = true; 
        } else { 
         $(this).next().text("☆"); 
         $(this).next().css("color", "#888"); 
         $(this).next().css("font-weight", "normal !important"); 
        } 
       }); 
      }); 
     } catch (err2) { 
      console.log(err2); 
     }