Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

PHP JQUERY check-boxes

Posted on 2011-10-10
11
Medium Priority
?
229 Views
Last Modified: 2012-05-12

Hello experts,

I am having a task and i am trying to understand how to...

I have a form in PHP.  At the end of the form there is a simple calculation.
In the form there are two check-boxes.

If the user click both of the check-boxes i need to add to the an amount to the final calculation (total).

so i am thinking that it needs to check before submitting the form and i am thinking maybe jquery can help?

i would be thankful if someone can direct me.
0
Comment
Question by:Refael
  • 6
  • 5
11 Comments
 
LVL 17

Expert Comment

by:sonawanekiran
ID: 36946763
Yes. You are true
Check the below code.
Test page : http://jsfiddle.net/MZMzF/

<HTML>
<HEAD>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
     <script type="text/javascript">
          $(document).ready(function() {
           
           $("input:checkbox").click(function(){
             calculate_total_if_checkboxes_checked();
           });
            });
            
            function calculate_total_if_checkboxes_checked(){
              var flag = true;
              
              $("input:checkbox").each(function(){
                if (!$(this).is(':checked')) 
                  flag = false;
              });
              
              if (flag) {
                var total = 100 + 10;
                $('#total').val(total);
              }
              else 
                $('#total').val("");
              
            }
            
     </script>
</HEAD>
<BODY>
    <input type="checkbox" id="chk1">Checkbox1 <br>
    <input type="checkbox" id="chk2">Checkbox2 <br>
    Total : <input type="text" id="total">
</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:Refael
ID: 36946830

Hi sonawanekiran

thank you so much!

in the page it works but not in the long form i have. its very strange but as soon as i take all the form out it works and when i include it in the form it does not work anymore.
0
 
LVL 17

Expert Comment

by:sonawanekiran
ID: 36946833
Show me your actual form code
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 17

Accepted Solution

by:
sonawanekiran earned 2000 total points
ID: 36946839
OR use below code. Remember I have added class "calPrice" to checkboxes.
<HTML>
<HEAD>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
     <script type="text/javascript">
          $(document).ready(function() {
           
           $(".calPrice").click(function(){
             calculate_total_if_checkboxes_checked();
           });
            });
            
            function calculate_total_if_checkboxes_checked(){
              var flag = true;
              
              $(".calPrice").each(function(){
                if (!$(this).is(':checked')) 
                  flag = false;
              });
              
              if (flag) {
                var total = 100 + 10;
                $('#total').val(total);
              }
              else 
                $('#total').val("");
              
            }
            
     </script>
</HEAD>
<BODY>
    <input type="checkbox" id="chk1" class="calPrice">Checkbox1 <br>
    <input type="checkbox" id="chk2" class="calPrice">Checkbox2 <br>
    Total : <input type="text" id="total">
</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:Refael
ID: 36946859


that's so funny...

when i use the wrong class names and i tick one of the check boxes it prints '110'.
when i use the chock boxes real class name (both the same) it does not print anything.
0
 
LVL 17

Expert Comment

by:sonawanekiran
ID: 36946864
What do you mean by real class name? Share your code
0
 

Author Comment

by:Refael
ID: 36946878

i the problem.
did you know that if you name the class "checkbox" it does not work!
i simply change the class name and it works!

e.g.

<input type="checkbox" id="chk2" class="checkbox">  // this does not work
<input type="checkbox" id="chk2" class="checkboxs">  // this works

Thank you!!!!

0
 

Author Closing Comment

by:Refael
ID: 36946883
Thank you sonawanekiran!
0
 
LVL 17

Expert Comment

by:sonawanekiran
ID: 36946886
No matter it also work. Check the below code.
<HTML>
<HEAD>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
     <script type="text/javascript">
          $(document).ready(function() {
           
           $(".checkbox").click(function(){
             calculate_total_if_checkboxes_checked();
           });
            });
            
            function calculate_total_if_checkboxes_checked(){
              var flag = true;
              
              $(".checkbox").each(function(){
                if (!$(this).is(':checked')) 
                  flag = false;
              });
              
              if (flag) {
                var total = 100 + 10;
                $('#total').val(total);
              }
              else 
                $('#total').val("");
              
            }
            
     </script>
</HEAD>
<BODY>
    <input type="checkbox" id="chk1" class="checkbox">Checkbox1 <br>
    <input type="checkbox" id="chk2" class="checkbox">Checkbox2 <br>
    Total : <input type="text" id="total">
</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:Refael
ID: 36946926

May i ask you how is it possible to use the value printed in php code?
for example if i want to print it in the document "<?php echo $total; ?> "
i am trying to figure it out how to combine the jquery with php.
0
 
LVL 17

Expert Comment

by:sonawanekiran
ID: 36946931
I am not PHP expert but you can php code in jquery like
$('#total').val(<?=$total?>);
0

Featured Post

[Webinar] Cloud and Mobile-First Strategy

Maybe you’ve fully adopted the cloud since the beginning. Or maybe you started with on-prem resources but are pursuing a “cloud and mobile first” strategy. Getting to that end state has its challenges. Discover how to build out a 100% cloud and mobile IT strategy in this webinar.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

These days socially coordinated efforts have turned into a critical requirement for enterprises.
Since pre-biblical times, humans have sought ways to keep secrets, and share the secrets selectively.  This article explores the ways PHP can be used to hide and encrypt information.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses
Course of the Month21 days, 3 hours left to enroll

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question