TalkPHP - Fancy Form checkboxes

TalkPHP (http://www.talkphp.com/forums.php)

- General (http://www.talkphp.com/general/)

- - Fancy Form checkboxes (http://www.talkphp.com/general/4459-fancy-form-checkboxes.html)

Kay1021

06-01-2009 11:29 PM

Fancy Form checkboxes

Hey has anyone ever used this fancy form mootools check box : http://lipidity.com/fancy-form

I was trying to implement into my php but i'm having a little difficulty and it doesn't really give me too many instructions.

Could anyone help me with how to set this up

i know in the form i think it's just <input type="checkbox">Blah blah blah</input>

but then i'm not sure what variable and such i'm suppose to use to know whether it's been checked or not.

Thanks

hjalmar

06-01-2009 11:54 PM

First let me say that I have never used mootools (well not a lot anyways), looking at the example page it looks like any other custom-form-element-js-replacement kinda deal. :)

So in that case it's like posting of a normal form, no? what values you gonna pass? how do you access it, name? ajax?

<input type="checkbox" name="some_name" value="some_value" />

Wildhoney

06-02-2009 12:01 AM

Considering the JS is correctly loaded, from the examples it appears as though the syntax for the HTML is as follows. The text won't be surrounded by an input, because inputs are self-closed (/>). Instead, it'll be contained within a label, as will the input itself.

Like so:

html4strict Code:

<label class="checked">
    <input type="checkbox" checked="checked" />
    Tick me, tick me!
</label>

Kay1021

06-02-2009 12:05 AM

thanks guys....i haven't really used checkboxes before in forms...i was trying to read up on it....but how exactly do i use it once the user hits submit?

Basically i'm creating a checklist type deal..... so ppl check off that they did something and then add the date and comment...

thanks for the help

hjalmar

06-02-2009 12:45 AM

Quote:

Originally Posted by Kay1021 (Post 24823)

As any other form control element(unless I missunderstood your question completly). But would help if you then either said what isn't working or provide some code (or live example).

Kay1021

06-02-2009 12:56 AM

I don't have any code...because im not sure exactly how to write it all up.

Wildhoney

06-02-2009 01:06 AM

Which part are you having difficulty with?

Kay1021

06-02-2009 05:21 AM

ok lets say i have a form

PHP Code:


		
			
<form action="page2.php" method="POST">
<label class="checked">
    <input type="checkbox"/>
    Tick me, tick me!
</label>
</form>

now I want to take the result of that (whether it's checked or not and input into my database so that when i display later...it will show the appropriate answer

I'm just not understanding this part of the whole thing...like what's the variable the holds this information so that input it into the database.

I'm sure this easy stuff...but for some reason i'm not getting it right now. Driving me crazy! It's not even that i'm having errors because i don't know where to start other than what's above and being connected to all the appropriate css and js.

Hope this makes sense

hjalmar

06-02-2009 05:59 AM

Quote:

Originally Posted by Kay1021 (Post 24831)

ok lets say i have a form

PHP Code:


		
			
<form action="page2.php" method="POST">

<label class="checked">

    <input type="checkbox"/>

    Tick me, tick me!

</label>

</form>

Well first of all what the javascript does is nothing more than visual aspect of things since the support for styling form elements vary from browser to browser.

The actual input element is then hidden or pushed out the screen with the help of css and then updated on interaction with javascript.

So do your forms as you normally would do, i.e give it a name, value and id (if you want to target that element on it's own)

Quote:

Then do as you would insert any other form element to the database, as in this case is $_POST["some_name"].

Wildhoney

06-02-2009 09:56 AM

Hjalmar has it spot on. Nothing changes apart from the visual aspect of things. The input it still there and behaves just like it would without the JavaScript.

Tanax

06-02-2009 10:02 AM

You could also check if the box is checked(for example for licence agreement tick-box).

PHP Code:


		
			
$agree = $_POST['licenceagreementbox'];
if($agree == 'checked') { // do what you want }
else { echo 'you have to agree to licence..'; }

Kay1021

06-02-2009 06:36 PM

I kinda thought that's how it would work....but it won't send any result...it's just empty

PHP Code:


		
			
<input type="checkbox" name="check" value="unchecked"/>

and then in the next page

PHP Code:


		
			
$check =$_POST['check'];

echo 'CHECK RESULT: '.$check;

like even if i just try to show what's in there before i start adding it to my database it just looks like this

CHECK RESULT:

empty....don't know what im doing wrong....man i hate checkboxes!

Kay1021

06-02-2009 07:49 PM

ok i don't know how it worked but now it almost works...i was looking at the js file and saw the name chk....so i changed check to chk and now it passes the result 'on' if it's checked.....but i don't know how when i got to my results page that it will show the checked box as on now.

Like i was the check mark to remain in my table if they selected it before....all the other ones will be the x's (unchecked) until someone choses it and then it will change to checkmark

Wildhoney

06-02-2009 08:53 PM

1 Attachment(s)

I've had a play, and it does appear that FancyForm uses the name attribute. Take a look at the attached file for the example I've been modifying. By clicking on the button you'll see the POST fields submitted.

html4strict Code:

<h2>TalkPHP Example</h2>

<form action='index.php' method="post">
    <label><input type="checkbox" name="SingleElement" checked="checked"> I'm a fancy cross-browser styled checkbox</label>
    <input type="submit" value="Submit Form" style='margin:1em;height:2.5em;background:#222;float:right;color:#fff'>
</form>

All times are GMT. The time now is 06:26 AM.