Link to home
Start Free TrialLog in
Avatar of tjyoung
tjyoung

asked on

Trying to change behaviour of a button with jquery/json result

In my app I'm clicking a link/button which generates a curl request and the request responds back with a url. Upon success the colour and text of my button changes (works fine) and ideally if I was to click the newly updated button, the url that was passed back in my json would be where my button click would now go to instead of generating the curl request.

I am receiving back the json encoded url example:
({"0":"http:\/\/reports.carproof.com\/mobile?id=ti5jfifjridjje"})  
and updating the href of my button which was previously just href="".

Issue is if you now click the button, it of course executes the curl request again instead of now going to the newly passed back url.

My question is: How could I change my code below so upon successful return of the url, it would open that instead of doing another curl request?

	$("#carproof_btn").click(function(e) {
		$("#carproof_text").text("Please hold...");
		$("#carproof_btn").removeClass('sButton sBlue').addClass('sButton sRed');
		$("#activity").attr('src',"assets/images/icons/loader13.gif");
		e.preventDefault();
        $.ajax({
            url: 'trades/carproof/?vin=<?php echo $trade["vin"]?>',
            type: "POST",
            success: function(result){
            if(result){
                $("#carproof_btn").removeClass('sButton sRed').addClass('sButton sGreen');
                $("#activity").attr('src',"assets/images/icons/sPlus.png");
                $("#carproof_text").text("Open Report"); //text changes on button
                $("#carproof_btn").attr("href", result[0] ); //the url is contained here
                } else {
                $("#carproof_text").text("Failed!");
                }
            }
        });
	});
</script>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Gary
Gary
Flag of Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of tjyoung
tjyoung

ASKER

Its real close but not quite happening:
When I click it opens a new window (which is what I'm after, but I didn't mention about a opening new window), AND it opens in the one the button is in. Can I get it to open only in a new window?

Does this help? This is the current button code:
<a href="" title="" target="blank" id="carproof_btn" class="sButton sBlue" style="margin-top: 0px; border:0px;"><img id="activity" src="assets/images/icons/sPlus.png" width="10" height="10" alt="" /><span id="carproof_text">Get CarProof</span></a>
You're contradicting yourself...
You want it to open in a new window? If yes then change

target="blank"
to
target="_blank"
Avatar of tjyoung

ASKER

Thanks I changed that. The problem is its opening the url twice (once in a new _blank window) and also in the window that contains the button.
I"m trying to get it to only open a new window.
Remove this

else{
location.href=$("#carproof_btn").attr("href")
}
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of tjyoung

ASKER

Thank you very much for your input. Works perfect with the unbinding addition.