开发者

document.myform.checkbox.checked without a form

开发者 https://www.devze.com 2023-02-13 04:58 出处:网络
i know that what i mentioned on the question (above) isn\'t possible, but i have a problem here, i have double tripe and so on, forms inside a page, and i need to submit a form that gets all the data

i know that what i mentioned on the question (above) isn't possible, but i have a problem here, i have double tripe and so on, forms inside a page, and i need to submit a form that gets all the data inside the previous forms.

WARNING: I started with javascript like 3 or 4 days ago, i am used to the server-side programming.

Let's see:

javascript checks if checkboxes are checked (Several of them):

function KeepCount() {

var NewCount = 0;

if (document.iphone3g.iphone3g1.checked)
{NewCount = NewCount + 1;}

if (document.iphone3g.iphone3g2.checked)
{NewCount = NewCount + 1;}

if (document.iphone3g.iphone3g3.checked)
{NewCount = NewCount + 1;}

if (document.iphone3g.iphone3g4.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs1.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs2.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs3.checked)
{NewCount = NewCount + 1;}

if (document.iphone3gs.iphone3gs4.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone41.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone42.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone43.checked)
{NewCount = NewCount + 1;}

if (document.iphone4.iphone44.checked)
{NewCount = NewCount + 1;}

if (NewCount > 1){
    descontox = 20/100;
    valorx = (total.value * descontox).toFixed(2);
    valor.value  = (total.value - valorx).toFixed(2);
    }

if (NewCount <= 1){
    valor.value = ("");}
}

This tells me if a discount should be applied or not, if more than one checkbox is selected it will apply a 20% discount.

If you notice, i have several "if (document.iphone3g.iphone3g1.checked) { do something} that interacts with this:

    <div id="one" class="hiddenDiv">

            <div class="image">
                <img class="large" src="images/iphone3g.png" alt="iphone3g" width="141" height="141" />
            </div>
            <form name="iphone3g">
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g1" value="50.00"> Vidro Partido<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g2" value="59.00"> LCD Danificado<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g3" value="80.00"> Substituir capa traseira<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3g4" value="38.00"> Botão Volume
            </form>
    </div>
            <div id="two" class="hiddenDiv">

            <div class="image">
                <img class="large" src="images/iphone3gs.png" alt="iphone3g" width="141" height="141" />
            </div>
    <form name="iphone3gs">
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs1" value="60"> Vidro Partido 3GS<br />
开发者_如何学Go    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs2" value="69"> LCD Danificado 3GS<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs3" value="89"> Substituir capa traseira 3GS<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone3gs4" value="45"> Botão Volume3GS

    </form>
    </div>
            <div id="three" class="hiddenDiv">

            <div class="image">
                <img class="large" src="images/iphone4.png" alt="iphone3g" width="141" height="141" />
            </div>
    <form name="iphone4">
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone41" value="169"> Vidro/LCD Partido<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone42" value="99"> Substituir capa traseira<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone43" value="79"> Botão Volume<br />
    <input onclick="clickCh(this);KeepCount();" type="checkbox" name="iphone44" value="76"> Botão Home

    </form>
    </div>

I have more than 3 of those, what can i do to solve the question? i need to submit these data to a php file.


Using jQuery, this could be done very succinctly.

// select all checked checkboxes with name attribute that starts with 'iphone'
var NewCount = $("input[name^='iphone']:checked").length;

if (NewCount > 1){
    descontox = 20/100;
    valorx = (total.value * descontox).toFixed(2);
    valor.value  = (total.value - valorx).toFixed(2);
    }

if (NewCount <= 1){
    valor.value = ("");}
}

EDIT: souza -- It appears based on your comments that you have already solved the issue by using a single form element. However, you would be wise to use a more generic approach like the one above, or the one posted by mrtsherman. Checking each individual input element by name will lead to a code maintenance nightmare.

It would require updating both the your markup and your javascript every time a new iPhone version and/or carrier, platform comes around. A more generic approach would allow you to simply add a new checkbox to the markup using the same naming convention and your javascript will simply handle it without the need to make any changes to the code.


Use Jquery. Easy to use for something like this. Here is a jsfiddle with it working.

$(document).ready(function() {
   $("input:checkbox").click(function() {
      var checked = $("input:checked").length;
      alert(checked);
   });
});
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号