Jquery thickbox - form problem

Jquery thickbox - form problem - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: Jquery thickbox - form problem (/showthread.php?tid=22517)

Jquery thickbox - form problem - El Forum - 09-12-2009

[eluser]Kristof[/eluser]
Hi guys,

I'm still new to CI. But i'm working on a new project (to learn CI). I want a registrationform within a jquery thickbox, check it and send it via ajax.
The sending part is easy but i have a problem with the checking of inputfield.
For some reason

Code:
var name = $("input#name").val();

wont work.

It seems like it can't find the inputfields. The strange part is that if i send the form using the js-function (serialize()), it does find the inputfields.

Any ideas ?
a live example is to be found on http://ci.denieuwekantine.be click on "not a member yet".

More info:
view:

Code:
[removed][removed]

[removed][removed]

<div id="contact_form">

  &lt;form name="contact" method="post" action=""&gt;

    <fieldset>

      <label for="name" id="name_label">Name</label>

      &lt;input type="text" name="name" id="name" size="30" value="" class="text-input" /&gt;

      <label class="error" for="name" id="name_error">This field is required.</label>

      <label for="email" id="email_label">Return Email</label>

      &lt;input type="text" name="email" id="email" size="30" value="" class="text-input" /&gt;

      <label class="error" for="email" id="email_error">This field is required.</label>

      <label for="phone" id="phone_label">Return Phone</label>

      &lt;input type="text" name="phone" id="phone" size="30" value="" class="text-input" /&gt;

      <label class="error" for="phone" id="phone_error">This field is required.</label>

        <br />

      &lt;input type="submit" name="submit" class="button" id="submit_btn" value="Send" /&gt;

    </fieldset>

  &lt;/form&gt;

</div>

regform.js

Code:
$(function() {

  $('.error').hide();

  $('input.text-input').css({backgroundColor:"#FFFFFF"});

  $('input.text-input').focus(function(){

    $(this).css({backgroundColor:"#FFDDAA"});

  });

  $('input.text-input').blur(function(){

    $(this).css({backgroundColor:"#FFFFFF"});

  });

  $(".button").click(function() {

        // validate and process form

        // first hide any error messages

    $('.error').hide();

      var name = $("input#name").val();

      //alert (name);

        if (name == "") {

      $("label#name_error").show();

      $("input#name").focus();

      return false;

    }

        var email = $("input#email").val();

        if (email == "") {

      $("label#email_error").show();

      $("input#email").focus();

      return false;

    }

        var phone = $("input#phone").val();

        if (phone == "") {

      $("label#phone_error").show();

      $("input#phone").focus();

      return false;

    }

});

So i hope someone can help me Smile

thanks in advance

Jquery thickbox - form problem - El Forum - 09-14-2009

[eluser]xzela[/eluser]
you can try abandoning ThinkBox altogether and create your own(controllable) version of it. jQuery is pretty easy to use when creating your own UI components.
If I remember correctly, ThinkBox uses an iFrame which can cause problems if you are not prepared for it.

Jquery thickbox - form problem - El Forum - 02-10-2010

[eluser]Unknown[/eluser]
with all of jquery box : jquery box list on google, which one is easy to used by CI ?