Question

Hi guys i have the following code in my view:

@model Test.tblReview

@{
    ViewBag.Title = "Create";
}

<div class = "under">
Add a New Review
</div>

<br />

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<link href="../../Content/themes/base/jquery.ui.slider.css" rel="stylesheet" type="text/css" />

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)


        <div class="editor-label">
            @Html.HiddenFor(model => model.ReviewID)
        </div>

        <div class="editor-field">
            @Html.HiddenFor(model => model.ReviewID)
            @Html.HiddenFor(model => model.ReviewID)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Recomendation)
        </div>


        <div class="editor-field">
            @Html.TextAreaFor(model => model.Recomendation, new { style = "max-width: 200px; max-height: 150px;" })
            @Html.ValidationMessageFor(model => model.Recomendation)
        </div>

    <br />


        <div class="editor-label">
            @Html.LabelFor(model => model.AvoidOrBuy)
        </div>



        <div class="editor-field">
            @Html.TextAreaFor(model => model.AvoidOrBuy, new { style = "max-width: 200px; max-height: 150px;" })
            @Html.ValidationMessageFor(model => model.AvoidOrBuy)
        </div>

        <br />

         <div class="editor-label">
          @*@Html.LabelFor(model => model.Posted)*@
        </div>

        <div class="editor-field">
            @Html.HiddenFor(m => m.Posted)
            @Html.ValidationMessageFor(model => model.Posted)
        </div>

        <br />

          <div class="editor-label">
            @Html.LabelFor(model => model.Score)
        </div>

     <br />

        <div class="demo" style="width: 185px">
        <div id="slider-range-max"></div>
        </div>

    <br />

       <p>Score Added From Scroll Bar</p>

        <div class="editor-field">
            @Html.EditorFor(model => model.Score)
            @Html.ValidationMessageFor(model => model.Score)
        </div>

     <br />
        <div class="editor-label">
            @Html.LabelFor(model => model.GameIDFK, "tblGame")
        </div>



        <div class="editor-field">
            @Html.DropDownList("GameIDFK", String.Empty)
            @Html.ValidationMessageFor(model => model.GameIDFK)
        </div>

        <div class="editor-label">
            @Html.HiddenFor(model => model.UserName)
        </div>

        <div class="editor-field">
            @Html.HiddenFor(model => model.UserName)
            @Html.HiddenFor(model => model.UserName)
        </div>

     <br />

        <p>
            <input type="submit" value="Create" />
        </p>

}

<div>
    @Html.ActionLink("Go To Reviews", "Index") |  @Html.ActionLink("Go Back To Games", "Index", "Game")
</div>

 <script type="text/javascript">
     $(function () {
         $("#slider-range-max").slider({
             range: "max",
             min: 1,
             max: 10,
             value: 1,
             slide: function (event, ui) {
                 $("#Score").val(ui.value);
             }
         });
         $("#Score").val($("#slider-range-max").slider("value"));
     });
    </script>

Everything works fine but i would like way to make the value in the drop down to clear once its been selected and the submit button is pressed, If you require addtional information please ask me thank you

Answer 1

the value in the drop down to clear once its been selected and the
submit button is pressed

Why do you need to do this ? I strongly believe that you should not change the value if you are going to submit it to an action method where you are going to read it for further processing. because you are not gonna get the selected value there. If you are not worried about the selected value, then you can clear that by jQuery like this

$(function(){
 $("form").submit(function(){
   $("#GameIDFK").empty();
   return true;
 });
});

Another thing came to my mind is that , If you really want to clear the drop down, but still use in your action method, you probably need to have a hidden input element in your form and using java script, you can set the selected value of drop down to that. Then in you can clear your drop down and then in your action method, you can read from the hidden input instead of the actual drop down.