Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    May 2012
    Thanked 0 Times in 0 Posts

    how to embed ajax/jquery form in html template

    Hi guys
    I have been struggling with this for the past 2 days. I can't get it to work. I don't know much coding, but usually I do things by trial and error and get things to work. But this time, I give up. I need help.

    I have downloaded the template located here: http://www.sendspace.com/file/agsytv

    you see how on the homepage there are 3 tabs: flight, hotel, rental?

    I want this part to function as a quote request form.

    When someone fills out this form and presses submit, they should get a message in that same box saying "thank you for your message...blah blah"
    the page should not refresh.

    I have downloaded several ajax contact us forms, but I don't know how to integrate these into the html page.

    here is one cool form (there is demo and download)

    here is another one: http://www.brightcherry.co.uk/scribb...th-validation/

    how do I do this?

    here is the result of my work if you want to see it (obviously form does not work)
    language (dot) comxa (dot) com

  2. #2
    God Emperor Fou-Lu's Avatar
    Join Date
    Sep 2002
    Saskatoon, Saskatchewan
    Thanked 2,668 Times in 2,637 Posts
    Despite the similar sounding names, Java is not the same as Javascript.
    Moving from Java forum to Javascript forum.

  3. Users who have thanked Fou-Lu for this post:

    mike316 (05-04-2012)

  4. #3
    Administrator VIPStephan's Avatar
    Join Date
    Jan 2006
    Halle (Saale), Germany
    Thanked 1,311 Times in 1,281 Posts
    At the very first you have to be clear about the fact that JS can be disabled so make sure that your form is working without JS before you go about AJAX and all that stuff. Then I guess the following is clear to you but Iím gonna say this anyway: it doesnít help do not know what youíre doing when you wanna do something. Building a website properly requires more than just trial and error. That said, the tutorial you linked to actually explains everything pretty well, you just have to take the time to actually read stuff, not just copy and paste the demo code. I know, this requires discipline and takes a little time but honestly, thatís what I (and I guess every decent coder here) expect from someone who wants to implement advanced features in their website(s).

    Now, Iím not gonna do your work, thatís what people usually get hired and paid for by people that have no clue about the technical stuff and still want a fancy website. Assuming that this is not an option for you Iím gonna give you some hints to help you in your learning experience:

    1. Validate your code. Valid HTML is helping very much in having a properly functioning website.
    2. jQuery is a JavaScript framework that has pre-made functions that are reusable and facilitate writing your own scripts. jQuery plug-ins (one of which is this AjaxForm plugin) are other pre-made functions that are dependant on that core framework. That means if you want to use a jQuery plugin or you want to write your own jQuery code you need to include the core framework at first, before you write or include any additional jQuery, and you need to include it only once in your HTML document. Usually when you browse for jQuery scripts online they tell you to include something like this:
      <script src="includes/jquery-x.x.x.min.js" type="text/javascript"></script>
      <script src="includes/jquery.pluginname.js" type="text/javascript"></script>
      <script type="text/javascript">
      $(document).ready(function() {
      	Ösome jQuery hereÖ
      The first line includes the jQuery core framework (the xís being the version number) and you only have to include this if you donít have it included previously. You have to omit that if youíre using jQuery for something else on your page already, otherwise it will lead to conflicts. Looking at the source code of your page I see that jQuery is referenced in the head already, and in a much more recent version (although still somewhat outdated) than what the demo at nettuts provides.
      The second line of the code above is the jQuery plugin. You need to make sure the file path is correct, otherwise the browser canít find it. And the rest is the script invoking the actual functionality of the plugin on your page.
    3. Your form has an action attribute with a reference to ďsubmitemail.phpĒ. If I submit the form, an error 404 comes up revealing that there is no such file (probably because thatís just the sample file name from the demo code you copied and pasted). As said earlier, you need to do the form processing on the server (i. e. without JavaScript). Not only to cater for the odd user with JS disabled but also because itís not possible to send an e-mail just with JS and without some server side script (at least as far as I know).

    So, youíve got a long way ahead of you and unless youíre really aiming to learn web development Iíd suggest to hire someone to implement that for you.

  5. Users who have thanked VIPStephan for this post:

    mike316 (05-04-2012)


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts