可以动态创建htmlhelpers吗?

时间:2015-06-21 14:36:45

标签: javascript html asp.net-mvc razor

我想根据下拉列表的值创建一个htmlhelpers元素。这是代码:

下拉

<select id="pracownicy">

        <option value="biurowy" style="color: black">Pracownik biurowy</option>
        <option value="przewodnik" style="color: black">Przewodnik</option>
    </select>

和脚本如:

 <script>
        function pracownicy() {
            var x = document.getElementById("pracownicy");

            if (x.value.equalTo("biurowy"))
            {



            }

            if (x.value.equalTo("przewodnik")) {

            }
        }


    </script>

在这些脚本中,我想动态创建这样的东西:

对于biurowy值:

 <div class="form-group">

            @Html.LabelFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Pracownik_biurowy, "", new { @class = "text-danger" })
            </div>
        </div>

对于przewodnik值:

  <div class="form-group">
            @Html.LabelFor(model => model.Przewodnik.Uprawnienia, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Przewodnik.Uprawnienia, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Przewodnik.Uprawnienia, "", new { @class = "text-danger" })
            </div>
        </div>

怎么做?

1 个答案:

答案 0 :(得分:1)

Here是一个有效的例子

function handleChange(){

    var strg="";
    $( "select option:selected" ).each(function(){
        strg = strg + this.value;
    });

    if (strg =="biurowy"){
        alert('adding1');
        $('#cont').append('<p>yourForm1</p>');
    } 

    if (strg =="przewodnik"){
                alert('adding2');
        $('#cont').append('<p>yourForm2</p>');
    } 


}

$('#pracownicy').change(handleChange);

您需要将<p>yourFormX</p>替换为您的表单代码。

注意我稍微更改了下拉代码,如下所示:

<select id="pracownicy">
    <option value="unselected" style="color: black">Not Selected</option>
    <option value="biurowy" style="color: black">Pracownik biurowy</option>
    <option value="przewodnik" style="color: black">Przewodnik</option>
</select>