ASP.NET MVC 5: Getting

Hi - I need help.  I'm new to MVC development and RESTful API architecture and could use some help.

Here's an an example of my URL:

www.mysite.com/customer/details/1

In the details View I want to make a GET AJAX call to my web API that passes that "1" parameter to the GET method.  

How do I pass that parameter (1) to the VIEW to call the API to GET the data?
cdemott33Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Julian HansenCommented:
I am not clear on the requirement
If you want to call this
var url="www.mysite.com/customer/details/1"

Open in new window

Then just call it ...
$.get(url, function(resp){
  // handle response
});

Open in new window


What am I missing?
0
cdemott33Author Commented:
Sorry if my question was unclear.

The routing to "www.mysite.com/customer/details/1" is handled by the customer controller, but in the details View, I want to call the GET function in the Customer API controller and pass the "1" as a parameter in the API GET call. Does this make sense? Or is this a totally wrong approach?
0
Julian HansenCommented:
It depends on how your MVC has been setup.

Usually a URL like www.mysite.com/customer/details/1 is calling a controller customer, view details parameter 1 so I am not sure what you are asking here?
0
Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

Kelvin McDanielSr. Developer/ConsultantCommented:
Are you saying that you want to either:
  • Make a call to a different REST API from the Customer 1 Detail after the content renders in the browser?
  • Make a call to a different REST API from within the CustomerController.Details(int id) function?
0
cdemott33Author Commented:
Let me try and better explain.

I need to get a distinct customer and display his or her details on the webpage.  To do this I need the parameter that is provided in the query string. (ie. www.mysite.com/customer/details/1)  In my case the parameter is the number 1.

My MVC Controller only returns the view.  It does not return data.  

public ActionResult Details()
        {
            return View();
        }

Open in new window


My API Controller does the work on querying the database.

        public IHttpActionResult GetCustomer(int Id)
        {
            var customer = _context
                .Customers
                .Include(c => c.IntakeType)
                .Include(c => c.Segment)
                .SingleOrDefault(c => c.Id == Id);

            if (customer == null)
                return NotFound();

            return Ok(Mapper.Map<Customer, CustomerDto>(customer));
        }

Open in new window


On my view page I have my AJAX code.  Here's a snippet:

$.ajax({
                url: '/api/customers/',   <--- THIS LINE HERE.
                dataSrc: "",
                type: "GET",
                data: {}
            }).done(function (data) {

Open in new window


The line I marked above is where I'm stuck.  I need to pass the parameter of "1" to the Customer API Controller so I can return that individual customers data.

How can I pass that parameter to the URL line so instead of this...

 url: '/api/customers/',

... it passes this...

url: '/api/customers/1',
0
Julian HansenCommented:
This is where I am confused why not just make the code in your view
var id = <%= CLIENTID HERE%>;
$.ajax({
                url: '/api/customers/' + id,   <--- THIS LINE HERE.
                dataSrc: "",
                type: "GET",
                data: {}
            }).done(function (data) {

Open in new window

Or code it directly into the URL string
You can also do
var data = {id: <%= CLIENTID HERE%>}
$.ajax({
                url: '/api/customers/',   <--- THIS LINE HERE.
                dataSrc: "",
                type: "GET",
                data: data
            }).done(function (data) {

Open in new window

Assumes your controller is looking for a url of controller/view?id=1 as an alternative

Basically the question is - why can't you simply just add the number to this line
                url: '/api/customers/',   <--- WHY CAN'T YOU JUST ADD IT HERE AS PART OF THE RENDER

Open in new window

0
cdemott33Author Commented:
Sorry, but I'm just very new to this so please bare with me.  

I would love to implement what your suggesting.  My question has to do with, how do you get this...

<%= CLIENTID HERE%>;

Should I pass the parameter value from the MVC Contoller via a ViewModel to the View like this...

public ActionResult Details(int id)
        {
            var vm =  new DetailsViewModel {
                Id = id
            };
            return View(vm);
        }

Open in new window


and then inject that value into my AJAX code like this?

$.ajax({
                url: '/api/customers/' + @Model.Id,
                dataSrc: "",
                type: "GET",
                data: data
            }).done(function (data) {

Open in new window


Is this the best way to approach this?  Again, I'm a newbie so I'm just looking for best practice for my situation.
0
Julian HansenCommented:
My question has to do with, how do you get this...
I am working on partial information here - I have no sight of your code or how it is implemented so I have provided a general approach with the expectation that you will adapt to suite your implementation.
<%= %> is the standard .Net output tags
ClientID - I have no idea where you are storing client id (the 1) I assume in a variable somewhere - you need to replace that

As to what is the best approach - again  I can't answer that on so few bits of information.

Let's look at it like this:
Your question is asking how to get the '1' into the url.
The answer is there are many ways - first we need to know where that value comes from - where in your model is that value stored.
Once we know that we can start examining ways to use that variable - which one is best is much of a muchness I am guessing - whatever is a best fit for you.

In your jQuery you have an AJAX call that requires a URL - you need that URL to include the Client ID (or similar) - the '1' - so how do we get it there.

Let's say that the model value is not available at the point that the AJAX is generated - not sure why it wouldn't be but for argument sake let us assume it is.

What you can do is output the value into a JavaScript variable somewhere else in your code
(Note I have no idea if this is correct - again no sight of your code base so I am guessing)
<script>var ClientID = '<%=@Model.id%>';</script>
Now we have a global variable ClientID on the page that holds the ID
Our jQuery can now assume that it is there and simply append it to the AJAX url
$.ajax({
    url: url: '/api/customers/' + ClientID

Open in new window


That is one method.

The other method is to add it to the URL as part of the render i.e. the result (in the browser) is the complete URL

As you have it here
url: '/api/customers/' + @Model.Id,

Open in new window

I don't believe will work as #Model.Id exist in the JavaScript space - i.e. unless I am misreading how your code works - the resulting line in the browser will include the string @Model.Id - which has no meaning in the browser and will generate an error.

I would have expected to see some sort of script tags to enclose the output of the model id i.e something like this
url: '/api/customers/<%=@Model.Id%>',

Open in new window

Again, I am guessing due to lack of necessary information.
1

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
cdemott33Author Commented:
Thank you for your help.  This puts me on the right path.
0
Julian HansenCommented:
You are welcome.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.