मैं चाहता हूं कि जब उपयोगकर्ता बटन पर क्लिक करें ऑर्डर सबमिट करें, अलर्ट बॉक्स में शब्द होते हैं और चयनित आकार और टॉपिंग की कुल कीमत भी दिखाई देती है, तो एक बटन ठीक है, इसलिए यह अलर्ट बटन बंद कर देगा। मुझे कुल कीमत की गणना करने के लिए जावास्क्रिप्ट का उपयोग करने की आवश्यकता है पिज्जा का यदि उपयोगकर्ता रेडियो बटन और चेकबॉक्स का चयन करता है। लेकिन मैं वास्तव में नहीं जानता कि यह कैसे करना है। क्या कोई मेरी मदद कर सकता है । इस समस्या के लिए बीटीडब्ल्यू मैं केवल जावास्क्रिप्ट और एचटीएमएल का उपयोग करता हूं

यह कुछ कोड हैं जिन्हें मैंने पहले ही html और जावास्क्रिप्ट का उपयोग करने पर प्रगति की है

<form>
<p><b>Step 2 : Select the size of pizza you want:</b></p>
        <input type="radio" name="size" value="small" id="radOne">Small
        <input type="radio" name="size" value="medium" id="radTwo">Medium
        <input type="radio" name="size" value="large" id="radThree">Large
        <br>

        <p><b>Step 3 : Select the pizza toppings you want:</b></p>
        <input type="checkbox" name="topping" value="peperoni">Pepperoni
        <input type="checkbox" name="topping" value="Sausage">Sausage
        <input type="checkbox" name="topping" value="Mushrooms">Mushrooms<br>
        <input type="checkbox" name="topping" value="Pineapple">Pineapple
        <input type="checkbox" name="topping" value="Black Olives">Black Olives
        <input type="checkbox" name="topping" value="Meatball">Meatball <br>

        <br>    
        <input type="button" onclick="submit()" value="Submit Order">
        <input type="button" onclick="reset()"  value="Clear Entries">
   </form>
<script>
    function submit() {
        document.getElementById("frm1").submit();
        var radOne = document.getElementById("radOne");
        var radTwo = document.getElementById("radTwo");
        var radThree = document.getElementById("radThree");
        var price;

        if (radOne.checked){
            price = 15.00;}
        else if (radTwo.checked){
            price = 20.00;}
        else
            price = 25.00;
        {alert("MY PIZZA CAFE");}

    }

    function reset() {
    document.getElementById("frm1").reset();
    }

    </script>
0
Nisha 21 अक्टूबर 2019, 05:02

3 जवाब

सबसे बढ़िया उत्तर

आप सही रास्ते पर हैं, बस सबमिट () फ़ंक्शन फ़ॉर्म सबमिट को ट्रिगर करता है जो रीडायरेक्ट करता है। सॉसेज और पेपरोनी के लिए नीचे दिए गए कोड को चेक करें और दूसरे चेकबॉक्स के लिए भी ऐसा ही करें।

function calculate(e) {
  var radOne = document.getElementById("radOne");
  var radTwo = document.getElementById("radTwo");
  var radThree = document.getElementById("radThree");
  var pepperoni = document.getElementById("pepperoni");
  var sausage = document.getElementById("sausage");
  var price;

  if (radOne.checked) {
    price = 15.00;
    alert("Small checked");
  }
  if (radTwo.checked) {
    price = 20.00;
    alert("Medium checked");
  }
  if (radThree.checked) {
    price = 25.00;
  }

  if (pepperoni.checked) {
    alert("Pepperoni checked");
    price += 1.5;
  }
  if (sausage.checked) {
    alert("Sausage checked");
    price += 2;
  }

  if (confirm("Your Pizza is " + "Total Price is " + price)) {
    alert("Ok");
  } else {
    alert("Cancelled");
  }
}

function reset(e) {
  document.getElementById("frm1").reset();
}
<html>

<body>
  <form>
    <p><b>Step 2 : Select the size of pizza you want:</b></p>
    <input type="radio" name="size" value="small" id="radOne">Small
    <input type="radio" name="size" value="medium" id="radTwo">Medium
    <input type="radio" name="size" value="large" id="radThree">Large
    <br>

    <p><b>Step 3 : Select the pizza toppings you want:</b></p>
    <input id="pepperoni" type="checkbox" name="topping" value="peperoni">Pepperoni
    <input id="sausage" type="checkbox" name="topping" value="Sausage">Sausage
    <input type="checkbox" name="topping" value="Mushrooms">Mushrooms<br>
    <input type="checkbox" name="topping" value="Pineapple">Pineapple
    <input type="checkbox" name="topping" value="Black Olives">Black Olives
    <input type="checkbox" name="topping" value="Meatball">Meatball <br>

    <br>

    <input type="button" onclick="calculate(this)" value="Submit" />
    <input type="button" onclick="reset(this)" value="Clear Entries" />
  </form>

</body>

</html>
0
Jerdine Sabio 21 अक्टूबर 2019, 03:29

किसी ने आपके प्रश्न का उत्तर दिया है। लेकिन यहाँ मेरा समाधान है। आप इसका उल्लेख कर सकते हैं। मदद करने की उम्मीद है, मेरे दोस्त :))

https://jsfiddle.net/ga7ptu5o/

<form id="frm1">
<p><b>Step 2 : Select the size of pizza you want:</b></p>
        <input type="radio" name="size" value="small" id="radOne">Small
        <input type="radio" name="size" value="medium" id="radTwo">Medium
        <input type="radio" name="size" value="large" id="radThree">Large
        <br>

        <p><b>Step 3 : Select the pizza toppings you want:</b></p>
        <input type="checkbox" name="topping" value="peperoni">Pepperoni
        <input type="checkbox" name="topping" value="Sausage">Sausage
        <input type="checkbox" name="topping" value="Mushrooms">Mushrooms<br>
        <input type="checkbox" name="topping" value="Pineapple">Pineapple
        <input type="checkbox" name="topping" value="Black Olives">Black Olives
        <input type="checkbox" name="topping" value="Meatball">Meatball <br>

        <br>    
        <input type="button" onclick="submitFunc()" value="Submit Order">
        <input type="button" onclick="reset()"  value="Clear Entries">      
   </form>

function submitFunc(){
        //document.getElementById("frm1").submit();
        var form = document.getElementById('frm1');        
        var price = 0;
        var size_value; 

        var checked_size = document.querySelector('input[name = "size"]:checked');
        var checked_topping = form.querySelectorAll('input[type = "checkbox"]');

        if(checked_size != null){  
            size_value = checked_size.value;
            if(size_value === 'small'){
                price = 15.00;
            }else if (size_value === 'medium'){
                price = 20.00;
            }else{
                price = 25.00;
            }
        } else {
            alert('You have to select a Pizza size'); 
            return;
        }

        var txt_topping = "";
        var i;
        for(i = 0; i < checked_topping.length; i++){
            if(checked_topping[i].checked){
                 txt_topping = txt_topping + checked_topping[i].value + ", ";
            }
        }

        if(txt_topping != '')
            txt_topping = '. With ' + txt_topping + ' topping';

        alert('You have selected ' + size_value + ' size, price is: ' + price + txt_topping);
    };

    function reset() {
        document.getElementById("frm1").reset();
    };
1
Tomato32 21 अक्टूबर 2019, 04:00
<form>
<p><b>Step 2 : Select the size of pizza you want:</b></p>
        <input type="radio" name="size" value="small" id="radOne">Small
        <input type="radio" name="size" value="medium" id="radTwo">Medium
        <input type="radio" name="size" value="large" id="radThree">Large
        <br>

        <p><b>Step 3 : Select the pizza toppings you want:</b></p>
        <input type="checkbox" name="topping" value="peperoni">Pepperoni
        <input type="checkbox" name="topping" value="Sausage">Sausage
        <input type="checkbox" name="topping" value="Mushrooms">Mushrooms<br>
        <input type="checkbox" name="topping" value="Pineapple">Pineapple
        <input type="checkbox" name="topping" value="Black Olives">Black Olives
        <input type="checkbox" name="topping" value="Meatball">Meatball <br>

        <br>    
        <input type="button" onclick="submitFX()" value="Submit Order">
        <input type="button" onclick="reset()"  value="Clear Entries">
   </form>
<script>
    function submitFX() {
     //   document.getElementById("frm1").submit();
        var radOne = document.getElementById("radOne");
        var radTwo = document.getElementById("radTwo");
        var radThree = document.getElementById("radThree");
        var price;

        if (radOne.checked){
            price = 15.00;}
        else if (radTwo.checked){
            price = 20.00;}
        else{
            price = 25.00;
            }
        alert("MY PIZZA CAFE \nTotal Price is : "+ price +"");

    }

    function reset() {
    document.getElementById("frm1").reset();
    }

    </script>
0
Hack Dawg 21 अक्टूबर 2019, 03:18