Как создать элемент управления AjaxToolKit (рейтинг) из кода в C#?

Question

Я создаю динамические элементы управления из выделенного кода, такого как текстовое поле, список флажков, radiobuttonlist и т. Д. И т. Д., И добавляю их в заполнитель внутри ретранслятора, чтобы создать динамический опрос из созданного пользователем шаблона, вопросы опроса, я хочу, чтобы они создавались из кода, но если есть какой-то другой способ динамического создания элементов управления, не могли бы вы, ребята, привести меня к определенной теме или показать пример кода?

Я думал что-то вроде..

 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);

но это не делает...

PD Я уже добавил изображения, которые нужны в примере, в css для создания звездочек элемента управления, попытался прочитать о рейтинге в MS с этим рейтингом ajaxtoolkit и другими безуспешно:(

РЕДАКТИРОВАНИЕ: Никогда не понял, поэтому я выбираю RadioButtonList для создания элемента управления в codebehind, а затем с помощью CSS и JS/JQuery для создания реального псевдоконтроля рейтинга.

Вы можете использовать это в качестве руководства для кода

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

Я освобожу свой код, чтобы вы могли использовать его, в качестве основы для вашего пользовательского рейтинга хехехе

Для CodeBehind попробуйте использовать PlaceHolder и использовать это:

                    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);
        }