如何從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); 
     }