在 ajax 发布后使用 php 页面更新 iframe

Question

$("form#update").submit(function() {
    var formData = $("form#update").serialize();
        $.ajax({
            type: "POST",
            url: "graph.php",
            data: formData + "&criteria=" + critSelected,
            success: function(data){
                $('div.graph').fadeOut(function(){$('div.graph').html(data).fadeIn();});
            }
        });
    return false;
});

I have this script that responds to a form submit. graph.php will be a full html page I would like to display without loading the entire page again. Is there any way for me to change the source of an iframe on the same page as the form to graph.php (say it's inside the div 'graph')? I've tried placing $('iframe').attr('src', url); in the success function to no avail. Help is appreciated. Thanks!

Answer 1

You can post directly to iframe using form.target='frame name' Than the result will be loaded in iframe automaticly

For example

<form method="POST" target="framename">...</form>

Answer 2

If I read what you've done correctly the reason it's not working is because you're trying to use url as a variable where it's the name of a property within ajax options. If you change your code to $("iframe").attr("src", "graph.php"); it should work or set alternatively set the url variable.

Concept Fiddle: http://jsfiddle.net/XcnMt/