Update iframe src based on input value

Question

I am trying to make an iframe change based on a text input field.

The string that I want to append to the url that the user will input is in the middle of the url though.

Have tried but not quite sure how to define it correctly

<script>

$("#search").click(function(e) {
        e.preventDefault();
 var url = "http://www2.sdfsdf.com/admin/agent_order_srch_ordet.asp?action=searchStrPostcode&idOrder=" $('#search').val(); "&Submit=Search";
        $("#someFrame").attr("src", url;
    })
</script>

Taha Paksu · Accepted Answer · 2012-11-05 14:18:05Z

2

You have a copy paste error inside your url variable. Here's the corrected version. And I used the plain javascript version to change the url.

<script>

$("#search").click(function(e) {
    e.preventDefault();
    var url = "http://www2.sdfsdf.com/admin/agent_order_srch_ordet.asp?action=searchStrPostcode&idOrder=" + $('#search').val() + "&Submit=Search";
    $("#someFrame").get(0).src = url;
});
</script>

edited Nov 5, 2012 at 14:18

answered Nov 5, 2012 at 14:00

Taha Paksu

15.6k2 gold badges50 silver badges83 bronze badges

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

2 Comments

Johnny86 Over a year ago

Hi thanks for this I have tried it but it does not update the iframe. I can see it adding src in firebug but it is empty.

Johnny86 Over a year ago

Hi there it was my fault. Had wrong id's that stopped it working. Its fine now. Many thanks

Rory McCrossan · Accepted Answer · 2012-11-05 13:59:11Z

1

Try this:

$("#search").click(function(e) {
    e.preventDefault();
    var url = "http://www2.sdfsdf.com/admin/agent_order_srch_ordet.asp?action=searchStrPostcode&idOrder=" + $(this).val() + "&Submit=Search";
    $("#someFrame").attr("src", url);
})

Note the + character is used to concatenate string values together.

answered Nov 5, 2012 at 13:59

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Collectives™ on Stack Overflow

Update iframe src based on input value

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related