Search jQuery

jQuery Forum

How to define and use ajax URL

in Using jQuery • 3 years ago

I am trying to create conditional URL for Ajax data pull, but it does not work. Any ideas why that is happening? My code looks like below.

$("#valink").click(function () {
$("#valink").removeClass("active");
var key = $(this).text();
$(this).addClass("active");
var currRoute = "../content-url/url.php";
if(key === "Books") {
currRoute = "../content-url/url1.php";
} else {
currRoute = "../content-url/url2.php";
}
$.ajax({
type: "GET",
url: currRoute,
async: false,
dataType: "html",
data: ({
key: key, }),
success : function(text){
$("#link .section").html(text);
}
});
});

Replies(8)

watusiware

Re: How to define and use ajax URL

3 years ago

Explain what you mean by "doesn't work".

Did you check the request and response in the Network tab of your desktop browser's debug tools?

Did you independently test your server with cUrl?

There is nothing "dynamic" here. You defined a fixed string with the exact URL:

"../content-url/url.php"

Was that not your intention?

dz.slick

Re: Re: How to define and use ajax URL

3 years ago

There are multiple scenarios where the URL differs. just showing only one here. There is an if statement that switches the URL. If I plug it in directly, it works, but if plugged in as a variable, it breaks.

watusiware

Re: How to define and use ajax URL

3 years ago

You did something wrong. That's all I can tell you based on what you posted.

We can't debug what we can't see.

Post your code that DOESN'T work!

It is just a string. There's nothing magic here. Paste together the parts you need to make the dynamic URL you want.

If you don't need to support ancient browsers, template literals are a handy way to paste together parts.

(ES6 syntax, all I use any more)

const studentID = '37654';
const operation = 'get';
const url = `students/${operation}/${studentID}`;

Or if you have to support older browsers, use +.

None of this has anything to do with jQuery.

watusiware

Re: Re: How to define and use ajax URL

3 years ago

I hope that's readable. Our wacky forum software is acting-up again.

watusiware

Re: How to define and use ajax URL

3 years ago

Also, do not use async: false.

Some browsers will warn you on the console not to use it.

Other browsers will simply not work.

dz.slick

Re: Re: How to define and use ajax URL

3 years ago

Thank you for all the feedback. I have updated the code just as I have it in my file. If add the URL directly, It pulls the data correctly.

watusiware

Re: How to define and use ajax URL

3 years ago

You haven't show us your HTML. We can't guess if <some-tag id=valink> has text, or if the text is a valid URL as you expect. And we can't guess if you have some code that populated the text. So, show us any code that does that.

Show us your HTML.

USE THE INSPECTION AND DEBUG TOOLS IN YOUR BROWSER!

- Is a request made?

- Is it a correct URL?

- Does the server respond with the correct data?

watusiware

Re: How to define and use ajax URL

3 years ago

Your code assumes you have something like this:

<input id="valink" type="button">Books</input>

and that you have ONE node with id="valink".

Your code presumes that some other code might CHANGE the text of the button.

If some of your code might remove the button and replace it, it will stop working when you do that, because you are using binding rather than delegation.

Too many things to guess. Make a jsFiddle!

Top Reply

Response title

Attachments

jQuery Forum

How to define and use ajax URL

Replies(8)

Re: How to define and use ajax URL

Re: Re: How to define and use ajax URL

Re: How to define and use ajax URL

Re: Re: How to define and use ajax URL

Re: How to define and use ajax URL

Re: Re: How to define and use ajax URL

Re: How to define and use ajax URL

Re: How to define and use ajax URL

Statistics

Tags

Actions

Related Posts