محاسبه قیمت واحد و قیمت کل توسط جاوا اسکریپت

با سلام من یک کد دارم به این شکل

کد HTML:

---

<label><input type="radio" name="radiobox" id="card" value="1234:5000"> کارت اول</label>
<label><input type="radio" name="radiobox" id="card" value="5678:10000"> کارت دوم</label>

<input type="number" name="quantity" id="quantity" min="0">

<p>قیمت واحد : <span id="unit_price">0</span></p>
<p>قیمت کل : <span id="total">0</span></p>

---

حالا می خام توسط جاوااسکریپت با کلیک کردن روی کارت اول یا دوم اعداد بعد از : را جدا کرده و با تعداد فیلد number ضرب کند و توی ای دی total نمایش دهد خروجی را و همچنین عدد جدا شده بعد از : را نیز درون ای دی unit_price نمایش دهد مثلا 1234:5000 در اینجا 5000 را ضرب در تعداد مثلا 1 2 ... n کند و آن را چاپ کند. لطفا راهنمایی کنید ممنون

سلام، دلیل وجود 1234 و 5678 داخل value دکمه های رادیویی چیه؟

نقل قول:

---

نوشته اصلی توسط mojtaba05

سلام، دلیل وجود 1234 و 5678 داخل value دکمه های رادیویی چیه؟

---

سلام من توی php عدد قبل : رو جدا می کنم و با اون مشخص می کنم که کاربر چه محصولی رو انتخاب کرده برای خرید کردن چون نام رادیوباکس ها همشون یکیه و نمی شه مشخص کرد توسط نام که کاربر کدام محصول رو انتخاب کرده

بفرمایید

http://jsfiddle.net/8pvvnneo

سلام،

اگر می تونید از جی کویری استفاده کنید به این شکل عمل کنید:

html:

کد:

---

<p><label for="card1"> کارت اول</label><input type="radio" name="radiobox" id="card1" value="1234:5000"></p>
<p><label for="card2"> کارت دوم</label><input type="radio" name="radiobox" id="card2" value="5678:10000"></p>

<input type="number" name="quantity" id="quantity" min="0">

<p>قیمت واحد : <span id="unit_price">0</span></p>
<p>قیمت کل : <span id="total">0</span></p>

---

js:

کد:

---

$(function(){
    $('input[name="radiobox"]').change(function(){
        var card = $(this).val();
        var splitCard = card.split(':');
            splitCard = splitCard[1];
        $('#unit_price').text(splitCard);
        var total = $('#quantity').val() * splitCard;
        $('#total').text(total);
    });
    $('#quantity').keyup(function(){
        var quantity = $(this).val();
        var unit = $('#unit_price').text();
        var total = unit * quantity;
        $('#total').text(total);
    });
})

---

دموی آنلاین: http://jsfiddle.net/sabeti05/1vfmu2gg/

فراموش نکنید که قبلش باید جی کویری رو فراخوانی کرده باشید.

نقل قول:

---

نوشته اصلی توسط mojtaba05

سلام،

اگر می تونید از جی کویری استفاده کنید به این شکل عمل کنید:

html:

کد:

---

<p><label for="card1"> کارت اول</label><input type="radio" name="radiobox" id="card1" value="1234:5000"></p>
<p><label for="card2"> کارت دوم</label><input type="radio" name="radiobox" id="card2" value="5678:10000"></p>

<input type="number" name="quantity" id="quantity" min="0">

<p>قیمت واحد : <span id="unit_price">0</span></p>
<p>قیمت کل : <span id="total">0</span></p>

---

js:

کد:

---

$(function(){
    $('input[name="radiobox"]').change(function(){
        var card = $(this).val();
        var splitCard = card.split(':');
            splitCard = splitCard[1];
        $('#unit_price').text(splitCard);
        var total = $('#quantity').val() * splitCard;
        $('#total').text(total);
    });
    $('#quantity').keyup(function(){
        var quantity = $(this).val();
        var unit = $('#unit_price').text();
        var total = unit * quantity;
        $('#total').text(total);
    });
})

---

دموی آنلاین: http://jsfiddle.net/sabeti05/1vfmu2gg/

فراموش نکنید که قبلش باید جی کویری رو فراخوانی کرده باشید.

---

ممنون این تابع addComma رو چطوری اضافه کنم بهشون اضافه نمی شه

کد:

---

function addComma(str){
                var objRegex = new RegExp('(-?[0-9]+)([0-9]{3})');
               
                while(objRegex.test(str)){
                    str = str.replace(objRegex, '$1,$2');
                }
               
                return str;
            }
           
            $(function(){
                $('input[name="radiobox"]').change(function(){
                    var card = $(this).val();
                    var splitCard = card.split(':');
                        splitCard = splitCard[1];
                    $('#unit_price').text(splitCard);
                    var total = $('#quantity').val() * splitCard;
                    $('#total').text(total);
                });
                $('#quantity').keyup(function(){
                    var quantity = $(this).val();
                    var unit = $('#unit_price').text();
                    var total = unit * quantity;
                    $('#total').text(total);
                });
            });

---

این قسمت که توی کد من اول بود، رو مجددا بیارید اول. قبل از تابع تون:

کد:

---

$(function(){

---

یعنی این جوری میشه:

کد:

---

            $(function(){
                function addComma(str){
                    var objRegex = new RegExp('(-?[0-9]+)([0-9]{3})');
                   
                    while(objRegex.test(str)){
                        str = str.replace(objRegex, '$1,$2');
                    }
                   
                    return str;
                }
                $('input[name="radiobox"]').change(function(){
                    var card = $(this).val();
                    var splitCard = card.split(':');
                        splitCard = splitCard[1];
                    $('#unit_price').text(splitCard);
                    var total = $('#quantity').val() * splitCard;
                    $('#total').text(total);
                });
                $('#quantity').keyup(function(){
                    var quantity = $(this).val();
                    var unit = $('#unit_price').text();
                    var total = unit * quantity;
                    $('#total').text(total);
                });
            });

---

می دونم ولی وقتی addComma رو به کد

کد:

---

$('#unit_price').text(splitCard);
$('#unit_price').text(addComma(splitCard));

---

اضافه می کنم این طوری می شه

قیمت واحد : 25,000

قیمت کل : NaN

بعد می خام برای هر دوتاشونم اونطوری بینشون کاما بزاره

به خاطر اینه که مقدار کل از محاسبه مقدار جز به دست میاد. با گذاشتن کاما، مقدار جز از حالت عددی خارج میشه و مقدار کل در محاسبه به مشکل می خوره و NaN رو برمی گردونه. می تونید یک متغیر جداگانه بسازید که نمایش داده نشه و فقط برای محاسبه به کار بره، یا با replace کردن، قبل از محاسبه کاما رو حذف کنید.

نقل قول:

---

نوشته اصلی توسط mojtaba05

به خاطر اینه که مقدار کل از محاسبه مقدار جز به دست میاد. با گذاشتن کاما، مقدار جز از حالت عددی خارج میشه و مقدار کل در محاسبه به مشکل می خوره و NaN رو برمی گردونه. می تونید یک متغیر جداگانه بسازید که نمایش داده نشه و فقط برای محاسبه به کار بره، یا با replace کردن، قبل از محاسبه کاما رو حذف کنید.

---

ممنون دستتون درد نکنه من از این کد استفاده کردم ایراد خاصی ندارد ؟

کد HTML:

---

$(document).ready(function(){
                // add comma
                function addComma( str ) {
                        var objRegex = new RegExp( '(-?[0-9]+)([0-9]{3})' );
                   
                        while( objRegex.test( str ) ) {
                            str = str.replace( objRegex, '$1,$2' );
                        }
                   
                        return str;
                }
   
                var cur = " تومان";
                cal = function(){
                var card = $(".card:checked").val();
                var splitCard = card.split(':');
                    splitCard = splitCard[1];
                var quantity = $("#quantity");
       
                var price = parseInt(splitCard);
                    if(price){
                        var num = quantity.val();
                        var total_price = price * num;
                        if(num.length == 0)
                            num = 0;
           
                        $("#unit_price").text(addComma(price + cur));
                        $("#total").text(addComma(total_price + cur));
                    }
                }
   
                $(".card").change(function(){
                    var card = $(this);
                    $(".card").removeAttr("checked");
                    card.attr("checked", "checked");
                    cal();
                });
       
                $("#quantity").keyup(function(){
                    cal();
                });
            });

---