Problem of loading external page into div by using jquery

I want to create the search page that search the history of log file. Because of limitation of display area, I want the user to limit the date range of the log file before displaying the search result.

I have created Datepickers "from" and "to" which will give the input the date range. The button will be the submit this date range.

<Form action="/" id="searchDate">
From: <input type="text" name="from" id="datepickerFrom"> 
To: <input type="text" name="to" id="datepickerTo">
<input type="submit" value="Submit"/>
</Form>

and here is script...

<script>
// attach a submit handler to the form
$("#searchDate").submit(function(event) {
  // stop form fr开发者_开发知识库om submitting normally
  event.preventDefault(); 
  var eID = $("#userID").val();
  // get some values from elements on the page:
  var $form = $( this ),
  termFrom = $form.find( 'input[name="from"]' ).val(),
  termTo = $form.find( 'input[name="to"]' ).val(),
  url = $form.attr( 'action' );
  // Send the data using post and put the results in a div
  $.post("/home/", function(data){
  $( "#result" ).load("/search/"); //.html(termFrom+" "+termTo);
  }

);
});
</script>

It was working if I use $( "#result" ).html(termFrom+" "+termTo); statement, but .html it is accept only string of html. I want to post the date into external page to perform the query and load that external page into div of search box page, so I use .load("/home/search/"). I just want to test loading the external page without passing post value, but it is not working. Why .load() is not working in this case?

Thank in advance...

if I understand 'external' correctly you get cross domain ajax policy problem - read more about it on http://usejquery.com/posts/9/the-jquery-cross-domain-ajax-guide

If you jsut want to test it without sending any post data then just use:

$.post("/home/search", function(data){

  $( "#result" ).html(data);

});

when you wnt to actually send the values you need to do:

$.post("/home/search",{"termFrom": termFrom, "termTo": termTo}, function(data){
  $( "#result" ).html(data);
});

Did you miss a quotation mark in the following code?

 $.post("/home/, function(data){
  $( "#result" ).load("/home/search/"); //.html(termFrom+" "+termTo);
  }

Would this cause the problem?