jquery.get function url parameter

Question

in the jquery.get() function, the first parameter is URL, is that the url to the content I want to retrieve or to the Controller/action method.

The problem is I'm building an asp.net-mvc application and I'm not sure what to pass as this parameter. Right now I'm passing my partialview.cshtml but nothing is being returned, not sure if I'm doing this right or wrong.

Here's what I got

<div id="editor_box"></div>
<button id="add_button">add</button>

<script>
var inputHtml = null;

var appendInput = function () {
    $("#add_button").click(function() {
        if (!inputHtml) {
            $.get('AddItem.cshtml', function (data) {
                inputHtml = data;
                $('#editor_box').append(inputHtml);
            });
        } else {
            $('#editor_box').append(inputHtml);
        }
    })
    };
</script>

also, what is the second parameter "function (data)" is this the action method?

"what is the second parameter" Read the documentation: api.jquery.com/jquery.get — epascarello
– epascarello, Commented Oct 20, 2014 at 17:54
I already did, I don't understand.. thats why I asked here, it says an object sent to the server, I'm not sure what I need to pass in that — Abdul Ahmad
– Abdul Ahmad, Commented Oct 20, 2014 at 17:55
You can pass parameters as second parameter, but in your case, it is success handler i.e. if get request succeeds, then it will do execute that function param. — Arindam Nayak
– Arindam Nayak, Commented Oct 20, 2014 at 17:56
I think this will help you to solve the issue stackoverflow.com/questions/7491978/… — Anbarasan Thangapalam
– Anbarasan Thangapalam, Commented Oct 20, 2014 at 17:57

score 1 · Accepted Answer · 2014-10-20 23:43:25Z

1

You need to remove var appendInput = function () { from the script. You are defining a function but never calling it. Just use the following (update you action and controller) names

<script>
  var inputHtml = null;
  $("#add_button").click(function() {
    if (!inputHtml) {
      $.get('@Url.Action("SomeAction", "SomeController")'', function (data) {
        inputHtml = data;
        $('#editor_box').append(inputHtml);
      });
    } else {
      $('#editor_box').append(inputHtml);
    }
  });
</script>

Edit

Based on your script you appear to be requiring the content only once (you then cache it and add it again on subsequent clicks. Another alternative would be to render the contents initially inside a hidden <div> element, then in the script clone the contents of the <div> and append it to the DOM

<div id="add style="display:none">@Html.Partial("AddItem")</div>

$("#add_button").click(function() {
  $('#editor_box').append($('add').clone());
});

edited Oct 20, 2014 at 23:43

answered Oct 20, 2014 at 23:33

user3559349

Sign up to request clarification or add additional context in comments.

8 Comments

Abdul Ahmad Over a year ago

I'm getting a 404 not found in the javascript console for the controller/action

Abdul Ahmad Over a year ago

dont controllers in asp.net get served per request? is this why it says resource not found?

user3559349 Over a year ago

@AbdulAhmad, You need to make sure the controller and action names are correct (currently they aren't which is why you get the 404 eror). But the 2nd option is a better solution anyway and unless you partial (AddItem.cshtml) is being reused in other views, then you may as a well put its html directly in this view (inside the hidden div)

Abdul Ahmad Over a year ago

thanks for following up with the answer, I'm not sure if other views will need this partial view (right now I'm guessing yes), but will keep your advice in mind to take the best approach possible

user3559349 Over a year ago

If you have a partial view named AddItem (say in the Views/Shared folder, then @Html.Partial("AddItem") renders the contents of that partial view so its the same as adding the html manually in the div. The reason for using a partial view is so that its a piece of reusable content that can be used in multiple views. For example you might have a partial for a banner or sidebar that you want to render in all views - just save you from recreating the html over and over again.

|

MrCode · Accepted Answer · 2014-10-20 17:57:11Z

1

The first argument to $.get is the URL which will respond with the expected data. jQuery/JavaScript don't care what kind of server side architecture you have or the scripting language. Whether the URL looks like a file AddItem.cshtml or a friendly route like /User/Sandeep, it doesn't matter as far as the client side is concerned.

In the case of ASP.NET, your URL endpoint can be generated like so:

$.get('@Url.Action("SomeAction", "SomeController")', function (data) {

answered Oct 20, 2014 at 17:57

MrCode

64.6k10 gold badges95 silver badges114 bronze badges

8 Comments

Abdul Ahmad Over a year ago

is there anything wrong with my script as a whole? its not calling my action method, I put a breakpoint on it

MrCode Over a year ago

Does the request get sent at all? Check the console (F12) on the Net tab. Also put a console.log("making request...") in the click event...

user3559349 Over a year ago

@AbdulAhmad, Does you action method expect a parameter? Your not currently passing anything to the method.

Abdul Ahmad Over a year ago

Sorry, was out, no it does not expect a parameter, checking console in a minute

Abdul Ahmad Over a year ago

I don't think the request is getting sent, the javascript console is not displaying anything in chrome

|

Collectives™ on Stack Overflow

jquery.get function url parameter

2 Answers 2

8 Comments

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related