tags:

views:

33

answers:

4

I want to create external JS file for the form and post that data using AJAX.

The simplified HTML looks like:

<form action="" id="message" name="message" method="post">
<input name="message_subject" type="text"  id="message_subject" class="message_wall" />
<textarea cols="50" rows="5" id="message_text" class="message_wall"></textarea>
<button type="submit" id="mess" class="mess">send</button>

The Jquery that I'm currently using for this form:

$("form#message").submit(function() {
  var message_subject = $(".message_subject").attr('value').replace(/\n/g,"<br/>").replace(/\n\n+/g, '<br /><br />').replace(/(\<\/?)script/g,"$1noscript");
  var message_text= $(".message_text").attr('value').replace(/\n/g,"<br/>").replace(/\n\n+/g, '<br /><br />').replace(/(\<\/?)script/g,"$1noscript");
  $.ajax({
    type: "POST",
    url: "mess/somefile.php",
    contentType: "application/x-www-form-urlencoded;charset=ISO-8859-2",
    data: "message_subject="+ message_subject + "&message_text=" + message_text,
    success: function(){
      $(".message_field").html('Thanks!');
    }
  });
  return false;
});

Can I this Jquery code be put in an external JS file and then called like:

$(document).ready(function(){
  myexternalfunction();
});
A: 

I would wrap your jQuery code in the $(document).ready(function() code throw all of the jquery code into a .js file, then use standard html to include it.

When the page is loaded by the browser, your JQuery code will be included as well.

Kris.Mitchell
A: 

You can use jQuery.getScript method. http://api.jquery.com/jQuery.getScript/

Kaltas
A: 

Consider this:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="common.js"></script>

And the common.js like this:

function initialize()
{
    // Your jQuery code goes here
}

// Now you have to call this code
$(initialize);
Otar
+1  A: 

yes you can...

you can do it by linking the js file to html like

<html>
<head>
<script>
//.........
// script calling some external js func
//.........
</script>
<body>
<!-- other tags -->
<script src="test.js" type="text/javascript"></script>
</body>
</html>

//test.js

$(document).ready(function()    {
        $('#arrow img').click(function()    {
            transferEmp('test');
        });
});

function transferEmp(postData)  {
    $.ajax({
        url: url,
        type: 'POST',
        data: postData,
        success: function(msg){
               //alert(msg);
        }
    });

}
Jaison Justus