CODEWITHSUNDEEP
c#asp.netasp.net-mvcasp.net-mvc-4
Melih
Melih

Reputation: 568

fill the textboxes with selecting dropdownlist in mvc

I want to fill textboxes which take data from database. When I select any value using dropdownlist, I need to get ID from dropdownlist and I call a function which fill @Html.EditorFor(model => model.taskName). The page musn't change. How is it possible?

<div class="form-group">
      @Html.LabelFor(model => model.jobID, "jobID", new { @class = "control-label col-md-2" })
       <div class="col-md-10">
      @Html.DropDownList("jobID", String.Empty)
      @Html.ValidationMessageFor(model => model.jobID)
</div>
</div>
     <div> @Html.Partial("../Location/taskname") </div>
</div>

taskname.cshtml

@Html.AntiForgeryToken()
    <div class="form-horizontal">
        @Html.ValidationSummary(true)
        <div class="form-group">
            @Html.LabelFor(model => model.taskName, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.taskName)
                @Html.ValidationMessageFor(model => model.taskName)
            </div>
        </div>
    </div>

Upvotes: 1

Views: 8198

Answers (1)

Ehsan Sajjad
Ehsan Sajjad

Reputation: 62488

Make your dropdown like this:

@Html.DropDownList("jobID", null, new {@id="job"})

and taskname text box :

@Html.EditorFor(model => model.taskName, new {@id="taskname"})

do like this, write jquery event for dropdown index change event, and send ajax call to get Task Name against the job Id selected from the dropdown list:

$('select#job').change(function(){

var JobId =$(this).val();


// Send Ajax call and get Task name

var Url = 'http://example.com/Controller/Action/?jobid='+JobId ;

$.ajax({
         url:    Url ,
         success: function(result) {
                     $('input#taskname').val(result); 
                  },
         error: function(error) {
                     alert(errorss); 
                  }

    });     


});

Upvotes: 1

Related Questions