How to automatically get value based on the first textbox in MVC

Question

5.00/5 (1 vote)

See more:

I have a textbox to enter Id and have another textbox to get the name of the person having the id in the first textbox. But the Id and firstname are in another table called students. Here my requirement is that when I enter the Id in the textfield I need to get the name of the student in the second textbox field. This is my controller

public async Task<ActionResult> Index()
        {
            var result = (from pm in db.Details
                          join d in db.Students on pm.Id equals d.ID
                          select new DetailsList
                          {
                              Id = d.ID,
                              Name = d.FirstName,
                              Cash=pm.Cash,
                              Date = pm.Date
                          }).ToList();
            return View(result);
        }

This is my controller part where I joined two tables into a model class called DetailsLists
In my view page

@model IEnumerable<A.Models.DetailsList>

<table>
                    <tr style="height:40px">
                        <th style="width:120px;">
                             ID
                        </th>
                        <td style="height:30px;">
                            <input type="text" class="form-control"/>
</td>
                    </tr>
                    <tr style="height:40px">
                        <th style="width:120px;">
                            @Html.DisplayNameFor(model=>model.FirstName)
                        </th>
                        <td>
                            <input type="text" class="form-control" />
                        </td>
                    </tr>
<td>
                            <p>
                                @Html.ActionLink("Create New", "Create")
                            </p>
                        </td>
                    </tr>
                </table>

can be either can enter the Id or can display all the Id's in drop down list and when selecting the Id it should display the Name in the second text box.

What I have tried:

I am new to mvc and I didnt get the correct way to do the task which I need can anyone please help me ??

Posted 3-May-17 23:55pm

ammu11

Updated 11-May-17 2:36am

Add a Solution

Comments

F-ES Sitecore 4-May-17 7:09am

google "onblur call ajax function" and "call mvc action ajax" and put the two together. Essentially you use the onblur event to call your mvc action passing the value of the id textbox field to your action and you then process the result. There are many examples of using ajax and mvc out there if you look, this isn't a homework writing service.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

mkcoder11 · Accepted Answer · 2017-05-11T02:36:00

You have 2 textboxes one for id and another for showing name based on the id. Here the best solutions will be to use jQuery AJAX. This is how to proceed.

1. On the first textbox keydown event make jQuery AJAX to call C# function on your Controller.
2. This C# function will receive the id and will fetch the name from the database based on this id and will return the name at the end.
3. You will then show that name on your name textbox.

The you will first apply .keydown() event on your id textbox like this:

C#

$( "#idtextbox" ).keydown(function() {
  //jquery ajax code
});

For making AJAX call you can use AJAX Method or jQuery Load.

You can also check this CodeProject Article that does ajax call in MVC application.