نمایش نتایج 1 تا 13 از 13

نام تاپیک: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

  1. #1
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    سلام دوستان

    دوستان من یه جدول دارم که تو هر ستون یه مقداری هست.یکی از ستونها یه تکست باکس هست که مقدارش هر بار تغییر میکنه میخام زمانیکه این مقدار تغییر کرد مقدار جدید محاسبه بشه و تو ستون بعدی نمایش داده بشه.ولی صفحه رفرش نشه
    اینم از کد صفحه من:

    @using (Html.BeginForm("AddGroup", "Admin", FormMethod.Post, new { id = "myForm" }))
    {
    <section id="content">
    <div class="container">
    <div class="row">
    <div class="col-lg-12">
    <table class="table-full table-total">
    <tr>
    <th>
    @Html.DisplayName("قیمت واحد")
    </th>
    <th>
    @Html.DisplayName("تعداد")
    </th>
    <th>
    @Html.DisplayName("قیمت نهایی")
    </th>
    </tr>
    @foreach (var item in Model)
    {
    <tr>
    <td>
    @item.Product.Price.ToString().Trim('0').Trim('.') .ToPrice() تومان
    </td>
    <td>
    @Html.TextAreaFor(modelItem => item.Count, new { @class = "txtCountProduct", style = "width: 40px; ", productid = item.Product.Id })
    </td>
    <td id="total_sum_value">
    @((@item.Count * @item.Product.Price).ToString().Trim('0').Trim('.' ).ToPrice()) تومان
    </td>
    </tr>
    }
    </table>
    </div>
    </div>
    </div>
    </section>
    }



    اینم از کد ajax برای گرفتن تعداد:
     @section Scripts{
    <script src="~/Scripts/AutoNumeric/jquery-price.js"></script>
    <script>
    $(function () {
    $(".txtCountProduct").price();
    $(".deleteProduct").click(function () {
    var id = $(this).attr("productid");
    var img = $(this);
    $.ajax({
    url: "/Home/RemoveCart",
    data: { Id: id },
    type: "Post",
    dataType: "Json",
    success: function (result) {
    if (result.Success) {
    img.parent().parent().hide();
    $("#CartItems").html(result.Html);
    }
    eval(result.Script);
    },
    error: function () {
    alert("خطا!");
    }
    });
    });
    $(".txtCountProduct").change(function () {
    var count = $(this).val();
    var id = $(this).attr("productid");
    $.ajax({
    url: "/Home/AddToCart",
    data: { Id: id, Count: count,t:1 },
    type: "Post",
    dataType: "Json",
    success: function (result) {
    if (result.Success) {
    $("#CartItems").html(result.Html);

    }
    eval(result.Script);
    },
    error: function () {
    alert("خطا!");
    }
    });
    });
    });


    </script>
    }

    عکس های ضمیمه عکس های ضمیمه
    • نوع فایل: jpg ddd.jpg‏ (14.8 کیلوبایت, 32 دیدار)

  2. #2
    کاربر دائمی آواتار Moien Tajik
    تاریخ عضویت
    شهریور 1392
    محل زندگی
    تهران
    پست
    564
    تشکر کردن
    25
    292 بار تشکر شده در 271 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    با استفاده از Angular :
    https://jsfiddle.net/MoienTajik/jvpujfzm/

  3. کاربرانی که به خاطر مطلب مفید Moien Tajik از وی تشکر کرده‌اند:


  4. #3
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    ممنون
    من برنامه رو طبق کدهای شما تغییر دادم و تا زمانیکه یه کالا هست درست کار میکنه اما اگر چندتا کالا باشه تعداد کالاها به تعداد کالای اول تغییر پیدا میکنه
    ممنون میشم راهنمایی کنید
    کدی که تغییر دادم اینجوریه:
     @Html.TextBoxFor(modelItem => item.Count, new { @class = "txtCountProduct", ng_model = "txtcount", data_ng_init = "txtcount=" + item.Count, style = "width: 40px;", productid = item.Product.Id })
    </td>
    <td id="total_sum_value">
    {{txtcount * @item.Product.Price}}
    </td>


    ddd.jpg

  5. #4
    کاربر دائمی آواتار Moien Tajik
    تاریخ عضویت
    شهریور 1392
    محل زندگی
    تهران
    پست
    564
    تشکر کردن
    25
    292 بار تشکر شده در 271 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    خب شما باید txtcount رو به ازای هر کالا عوض کنید تا در صفحه هر کدوم unique باشن که باهم قاطی نشن ، با یه for میتونید اینکار رو مدیریت کنید ، به txtcount به تعداد کالا ها یک عدد اضافه کنید.

  6. کاربرانی که به خاطر مطلب مفید Moien Tajik از وی تشکر کرده‌اند:


  7. #5
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    ممنون
    اما من متوجه نمیشم باید چیکار کنم؟اخه تو ویو چطور میتونم این کاری که شما میگین کنترل کنم؟

     @{int i = 1;}
    @foreach (var item in Model)
    {

    <tr>

    <td>
    @item.Product.Price.ToString().Trim('0').Trim('.') .ToPrice() تومان
    </td>
    <td>
    @Html.TextBoxFor(modelItem => item.Count, new { @class = "txtCountProduct", ng_model = "txtCount"+i, data_ng_init = "txtCount"+i+"="+item.Count, style = "width: 40px;", productid = item.Product.Id })
    </td>
    <td id="total_sum_value">
    {{txtCount@(i) * @item.Product.Price}}

    </td>
    </tr>
    i++;
    }


    منظورتون اینجوریه؟داره درست چواب میده ولی واقعیتش منطق کار خودمو نمیفهمم.درسته؟
    آخرین ویرایش به وسیله sara_t : چهارشنبه 22 دی 1395 در 11:59 قبل از ظهر

  8. #6
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    حالا اگر من بخام جمع کل ستون
    <td id="total_sum_value">

    {{txtCount@(i) * @item.Product.Price}}



    </td>
    رو به روش angular بدست بیارم باید چیکار کنم؟ممنون میشم راهنمایی کنید

  9. #7
    کاربر دائمی آواتار Moien Tajik
    تاریخ عضویت
    شهریور 1392
    محل زندگی
    تهران
    پست
    564
    تشکر کردن
    25
    292 بار تشکر شده در 271 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    نقل قول نوشته شده توسط sara_t مشاهده تاپیک
    ممنون
    اما من متوجه نمیشم باید چیکار کنم؟اخه تو ویو چطور میتونم این کاری که شما میگین کنترل کنم؟

     @{int i = 1;}
    @foreach (var item in Model)
    {

    <tr>

    <td>
    @item.Product.Price.ToString().Trim('0').Trim('.') .ToPrice() تومان
    </td>
    <td>
    @Html.TextBoxFor(modelItem => item.Count, new { @class = "txtCountProduct", ng_model = "txtCount"+i, data_ng_init = "txtCount"+i+"="+item.Count, style = "width: 40px;", productid = item.Product.Id })
    </td>
    <td id="total_sum_value">
    {{txtCount@(i) * @item.Product.Price}}

    </td>
    </tr>
    i++;
    }


    منظورتون اینجوریه؟داره درست چواب میده ولی واقعیتش منطق کار خودمو نمیفهمم.درسته؟
    بله درسته ، دلیلش هم اینه که هر input باید در صفحه unique باشه تا بشه روش محاسبه کرد ، اگر 2 input با name مشابه وجود داشته باشه تشخیص نمیده که برای کدوم محاسبه انجام بشه ، شما با قرار دادن for میاید و هر input رو بهش 1 عدد اضافه میکنید تا مشابه در صفحه نداشته باشه .

    حالا اگر من بخام جمع کل ستون
    <td id="total_sum_value">

    {{txtCount@(i) * @item.Product.Price}}



    </td>
    رو به روش angular بدست بیارم باید چیکار کنم؟ممنون میشم راهنمایی کنید
    یک مثال شبیه چیزی که میخواستید نوشتم براتون :
    http://uplod.ir/97rukckbuifh/ShopTest.zip.htm

  10. کاربرانی که به خاطر مطلب مفید Moien Tajik از وی تشکر کرده‌اند:


  11. #8
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    واقعا عالی بود ممنونم

  12. #9
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    سلام
    من میخاستم زمان حذف کالا هم صفحه رفرش نشه.و کد زیر رو براش نوشتم اما الان زمانیکه یه کالا رو حذف میکنم مجموع خرید رو نمیتونم با آنگولار کنترل کنم ممنون میشم راهنمایی کنید:
    <td>
    <img src="~/Content/img/delete.png" alt="حذف محصول" style="cursor:pointer;" class="deleteProduct" productid="@item.Product.Id" type="deletepr" />
    </td>


    کد HTML:
       $(".deleteProduct").click(function () {
                   
                    var id = $(this).attr("productid");
                    var img = $(this);
                    $.ajax({
                        url: "/Home/RemoveCart",
                        data: { Id: id },
                        type: "Post",
                        dataType: "Json",
                        success: function (result) {
                            if (result.Success) {
                                img.parent().parent().hide();                            
                                $("#CartItems").html(result.Html);
                                location.reload();
                                
                            }
                            
                            eval(result.Script);
                        },
                        error: function () {
                            alert("خطا!");
                        }
                    });
                });
    الان برای درست کار کردن برنامه یه reload اضافه کردم که فکر کنم کار جالبی نباشه.یعنی هر بار یه کالا حذف میشه صفحه رو رفرش میکنم تا مجموع درست بشه

  13. #10
    کاربر دائمی آواتار Moien Tajik
    تاریخ عضویت
    شهریور 1392
    محل زندگی
    تهران
    پست
    564
    تشکر کردن
    25
    292 بار تشکر شده در 271 پست

    Thumbs up نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    میتونید در رویداد onclick برای دکمه حذف یک function بنویسید شبیه مثالی که فرستادم براتون ; وقتی روی دکمه حذف کلیک شد ، دوباره مجموع رو حساب کنه ( دریافت مجموع فعلی و کم کردن قیمت کالای کلیک شده برای حذف ازش ) و html مجموع رو با jquery تغییر بده .

  14. کاربرانی که به خاطر مطلب مفید Moien Tajik از وی تشکر کرده‌اند:


  15. #11
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

     <script>
    $(document).ready(function(){
    $("#myTable").on('click','.deleteProduct',function (){
    var currentRow=$(this).closest("tr");
    var col4=currentRow.find("td:eq(4)").html();
    var lresult= $("#lastResult").text();
    lresult=lresult-col4;
    $("#lastResult").text(lresult)
    });
    });
    </script>


    اینجوری مشکل رو حل کردم ممنون

  16. #12
    کاربر دائمی
    تاریخ عضویت
    دی 1389
    پست
    412
    تشکر کردن
    459
    23 بار تشکر شده در 20 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    فقط یه سوال
    من برای هر فرخوانی هی هر بار یه اسکریپت مینویسم.از اونجایی که تازه کارم این روشم درسته؟
    من کد کامل اسکریپتهام رو میذارم.بنظرتون شلوغ و بد نیس؟راهی برای درست شدن داره؟منظورم از لحاظ درست نوشتن و سرعت کار هست
    @section Scripts
    {
    <script src="~/Scripts/angular.js">
    </script>
    <script src="~/Scripts/AutoNumeric/jquery-price.js"></script>
    <script>
    $(function () {
    $(".txtCountProduct").price();
    $(".deleteProduct").click(function () {
    var id = $(this).attr("productid");
    var img = $(this);

    $.ajax({
    url: "/Home/RemoveCart",
    data: { Id: id },
    type: "Post",
    dataType: "Json",
    success: function (result) {
    if (result.Success) {
    img.parent().parent().hide();
    $("#CartItems").html(result.Html);
    // location.reload();

    }
    eval(result.Script);
    },
    error: function () {
    alert("خطا!");
    }
    });
    });
    $(".txtCountProduct").change(function () {
    var count = $(this).val();
    var id = $(this).attr("productid");
    $.ajax({
    url: "/Home/AddToCart",
    data: { Id: id, Count: count,t:1},
    type: "Post",
    dataType: "Json",
    success: function (result) {
    if (result.Success) {
    $("#CartItems").html(result.Html);
    }
    eval(result.Script);
    },
    error: function () {
    alert("خطا!");
    }
    });
    });
    });

    </script>
    <script>
    $(document).ready(function() {
    function checkSum() {
    var sum = 0;
    var lastItemId = @Model.Count;
    for (var i = 1; i <= lastItemId; i++) {

    sum += Number($("#lastPrice" + i).text());
    }

    $("#lastResult").text(sum);
    }
    checkSum();
    $("input[type='number']").click(function() {
    checkSum();
    });
    $("input[type='number']").keyup(function() {
    checkSum();
    });
    });
    var app = angular.module("shopApp", []);
    app.controller("HomeController", function($scope) {
    });
    </script>
    <script>
    $(document).ready(function(){
    $("#myTable").on('click','.deleteProduct',function (){
    var currentRow=$(this).closest("tr");
    var col4=currentRow.find("td:eq(4)").html();
    var lresult= $("#lastResult").text();
    lresult=lresult-col4;
    $("#lastResult").text(lresult)
    });
    });
    </script>
    }


  17. #13
    کاربر دائمی آواتار Moien Tajik
    تاریخ عضویت
    شهریور 1392
    محل زندگی
    تهران
    پست
    564
    تشکر کردن
    25
    292 بار تشکر شده در 271 پست

    نقل قول: تغییر مقدار یه ستون جدول بدون رفرش شدن صفحه

    درست هست اشکال نداره ، میتونید برای مرتب شدن بیشتر کدتون ، کدهارو داخل یه فایل js دیگه بریزید و جدا فراخانی کنید .
    برای سرعت هم minify و bundling یادتون نره .

  18. کاربرانی که به خاطر مطلب مفید Moien Tajik از وی تشکر کرده‌اند:


تاپیک های مشابه

  1. سوال: تغيير Theme بدون رفرش شدن صفحه
    نوشته شده توسط bftarane در بخش jQuery
    پاسخ: 12
    آخرین پست: یکشنبه 18 فروردین 1392, 10:49 قبل از ظهر
  2. سوال: تغییر عکس بصورت خودکار بدون رفرش شدن صفحه
    نوشته شده توسط modern_amin در بخش ASP.NET
    پاسخ: 8
    آخرین پست: سه شنبه 03 آبان 1390, 09:41 قبل از ظهر
  3. گرفتن اطلاعات از فرم بدون رفرش شدن صفحه
    نوشته شده توسط .fatemeh در بخش JavaScript و Framework های مبتنی بر آن
    پاسخ: 2
    آخرین پست: دوشنبه 06 دی 1389, 00:33 قبل از ظهر
  4. سوال: رفرش شدن عکس روی سرور بدون رفرش شدن صفحه
    نوشته شده توسط khazaie01 در بخش طراحی وب (Web Design)
    پاسخ: 16
    آخرین پست: شنبه 24 مرداد 1388, 16:51 بعد از ظهر
  5. نمایش تعداد پیغام های رسیده بدون رفرش شدن صفحه
    نوشته شده توسط jannati در بخش ASP.NET
    پاسخ: 4
    آخرین پست: چهارشنبه 05 مهر 1385, 15:03 بعد از ظهر

قوانین ایجاد تاپیک در تالار

  • شما نمی توانید تاپیک جدید ایجاد کنید
  • شما نمی توانید به تاپیک ها پاسخ دهید
  • شما نمی توانید ضمیمه ارسال کنید
  • شما نمی توانید پاسخ هایتان را ویرایش کنید
  •