none
Datalist içinde çarpma yapmak RRS feed

  • Soru

  • Merhaba 

    Datalist içindeki  iki alanım var. "Fiyat" sabit olarak databaseden geliyor. Adet kısmını datalist içinden dropdownlist ile seçiyorum.

    bunları dinamik olarak çarptırıp başka bir labela yazmam gerekiyor. Nasıl yapabilirim? Hangi eventi kullanmam gerekiyor? Burda önemli olan nokta dropdownlistte adeti her değiştirdiğimde sayfa yenilenmeden sonucun değişmesidir.

    Teşekkürler.

    10 Mart 2014 Pazartesi 14:01

Yanıtlar

  • Dediğim gibi buradan tarif etmek biraz zor, kendinize uygularken sorunlar çıkabilir. Client'te çalışacak script olduğu için, html response'u baz alarak yazmalıyız. Şunu deneyin;

    <asp:Panel CssClass="tutarPaneli">
        Fiyat:
        <asp:Label Text='<%# Eval("Fiyat") %>' CssClass="fiyat" />
        <br />
        Miktar:
        <asp:DropDownList CssClass="miktar">
            <ListItem Value="1" Text="1" />
            <ListItem Value="2" Text="2" />
            .
            .
       </asp:DropDownList>
       <br />
        <Label CssClass="tutar" Text="" />
    </asp:Panel>

    Bu DataList'in ItemTemplate içindeki tasarım. Bunun html response'unda elementleri yakalayabilmek için CssClasslarına classlar atadım. Bunu jQuery ile kullanalım;

    <script>
        $(function(){
            $('.tutarPaneli').each(function(i,e) {
                 $(e).find('.miktar').change(function() {
                     $(e).find('.tutar').html($('e').find('fiyat').html() * $(this).val());
                 });
            });
        });
    </script>

    Denemediğim bişey, hataları olabilir.


    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC


    11 Mart 2014 Salı 11:08
    Moderatör
  • Onay Bey teşeeküür ederim tekrardan. Kod lazım olur arkadaşlara belki ben burada paylaşayım.

      <script type="text/javascript">
            $(function () {
                $('.tutarPaneli').each(function (i, e) {
                    $(e).find('.miktar').change(function () {
                        alert($(e).find('.fiyat').html() + "x" + parseInt($(this).val()));
                        $(e).find('.tutar').html(parseFloat($(e).find('.fiyat').html()) * parseInt($(this).val()));
                    });
                });
            });
        </script>


    a

    11 Mart 2014 Salı 13:31

Tüm Yanıtlar

  • jQuery ile kolayca yapabilirsiniz.

    <span id="fiyat">15</span>
    <select id="ddlMiktar>
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
    </select>
    <br />
    <span id="sonuc"></span>
    
    
    <script>
    $(function(){
       $('#ddlMiktar').change(function(){
          $('#sonuc').html($(this).val() * $('#fiyat').html());
       });
    });
    </script>

    gibi.


    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC

    10 Mart 2014 Pazartesi 14:18
    Moderatör

  •        <asp:DataList ID="DataList1" DataKeyField="SIRANO" runat="server" 
                                onitemcommand="DataList1_ItemCommand"  >

    .......

    Fiyat:<asp:Label ID="Label5" runat="server" Text='<%#Eval("URUNFIYAT") %>'></asp:Label>
     Adet:<asp:DropDownList ID="DropDownList1" runat="server" Height="20px" Width="48px">
                                        <asp:ListItem>0</asp:ListItem>
                                        <asp:ListItem>1</asp:ListItem>
                                        <asp:ListItem>2</asp:ListItem>
                                        <asp:ListItem>3</asp:ListItem>
                                    </asp:DropDownList>

      <b> Toplam:<asp:Label ID="Label7" runat="server"></asp:Label></b>
                                  

                                       <script type="text/javascript">
                                           $(function () {
                                               $('#DropDownList1').change(function () {
                                                   $('#Label7').html($(this).val() * $('#Label5').html());
                                               });
                                           });
    </script>
                             

    .... 

    Yazdığınız gibi denedim fakat malesef ki datalist içinde sonuç alamadım. 



    10 Mart 2014 Pazartesi 14:28
  • o şekilde olmaz, sayfa kaynağını görüntülerseniz ID lerin değiştiğini göreceksiniz.

    Ben örneği verirken c/p yapacağınızı düşünmemiştim. itemtemplate in içine yazdıysanız birsürü tekrarlamıştır o kodu. İşin açıkcası buradan yazarak anlatmam zor. Bi mail atın bana uzaktan bağlanıp yapayım, daha kolay olur.


    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC

    10 Mart 2014 Pazartesi 14:44
    Moderatör
  • Konu hakkında yardım edebilecek  var mı?
    11 Mart 2014 Salı 01:33
  • o şekilde olmaz, sayfa kaynağını görüntülerseniz ID lerin değiştiğini göreceksiniz.

    Ben örneği verirken c/p yapacağınızı düşünmemiştim. itemtemplate in içine yazdıysanız birsürü tekrarlamıştır o kodu. İşin açıkcası buradan yazarak anlatmam zor. Bi mail atın bana uzaktan bağlanıp yapayım, daha kolay olur.


    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC

    Hocam aynı sıkıntıyı bnde  cok fazla yasıyorum idler değiştiği için script kullanarak yapamıyorum. bunun nasıl yapılacagını vakit ayırıp yazabilirseniz sevinirim. 


    i can change the world, just need the source code..

    11 Mart 2014 Salı 08:40
  • bu arada codebehind tarafında,

    protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e) 
    {
        Label Label1 = e.Item.FindControl("Label1") as Label;
    }

    aşağıdaki gibi datalist içindeki itemları yakalayabilir ve istediğin işlemi yapabilirsin. Sayfa yenilecektir, bunun olmasını istemiyorsan update panel kullanarak bu sorununu cozebilirsin. 


    i can change the world, just need the source code..

    11 Mart 2014 Salı 08:42
  •       protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
            {
      

                DropDownList adett = e.Item.FindControl("DropDownList1") as DropDownList;
                Label urunfiyat = e.Item.FindControl("Label5") as Label;
                Label toplamtutar = e.Item.FindControl("Label7") as Label;
                    toplamtutar.Text = ((Convert.ToInt32(adett.Text)) * (Convert.ToInt32(urunfiyat.Text))).ToString();
              
            }


    şeklinde denedim yine olmadı malesef.

              

    a


    11 Mart 2014 Salı 09:05
  • Dediğim gibi buradan tarif etmek biraz zor, kendinize uygularken sorunlar çıkabilir. Client'te çalışacak script olduğu için, html response'u baz alarak yazmalıyız. Şunu deneyin;

    <asp:Panel CssClass="tutarPaneli">
        Fiyat:
        <asp:Label Text='<%# Eval("Fiyat") %>' CssClass="fiyat" />
        <br />
        Miktar:
        <asp:DropDownList CssClass="miktar">
            <ListItem Value="1" Text="1" />
            <ListItem Value="2" Text="2" />
            .
            .
       </asp:DropDownList>
       <br />
        <Label CssClass="tutar" Text="" />
    </asp:Panel>

    Bu DataList'in ItemTemplate içindeki tasarım. Bunun html response'unda elementleri yakalayabilmek için CssClasslarına classlar atadım. Bunu jQuery ile kullanalım;

    <script>
        $(function(){
            $('.tutarPaneli').each(function(i,e) {
                 $(e).find('.miktar').change(function() {
                     $(e).find('.tutar').html($('e').find('fiyat').html() * $(this).val());
                 });
            });
        });
    </script>

    Denemediğim bişey, hataları olabilir.


    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC


    11 Mart 2014 Salı 11:08
    Moderatör
  • Onay Bey teşekkür  ederim öncelikle

    Şu ana kadar en çok yaklaştığım noltadayım sanırım. tutar labelı tetikleniyor. Fakat sonuç "0" geliyor her seferinde. Problem nerede olabilir? Javascript hiç bimiyorum açıkcası kusura bakmayın.


    a

    11 Mart 2014 Salı 12:17
  • <script>
        $(function(){
            $('.tutarPaneli').each(function(i,e) {
                 $(e).find('.miktar').change(function() {
    alert(
    $('e').find('fiyat').html());
    alert($('e').val()); $(e).find('.tutar').html($('e').find('fiyat').html() * $(this).val()); }); }); }); </script>

    şeklinde denermisin. alertler değerleri vermesi lazım biri 0 ise sonucu 0 yapıyordur.


    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC

    11 Mart 2014 Salı 13:00
    Moderatör
  • hocam anlaşılan değerlere ulaşamıyor.Biri  null biri undefined geliyor.

    a

    11 Mart 2014 Salı 13:02
  • Onay Bey teşeeküür ederim tekrardan. Kod lazım olur arkadaşlara belki ben burada paylaşayım.

      <script type="text/javascript">
            $(function () {
                $('.tutarPaneli').each(function (i, e) {
                    $(e).find('.miktar').change(function () {
                        alert($(e).find('.fiyat').html() + "x" + parseInt($(this).val()));
                        $(e).find('.tutar').html(parseFloat($(e).find('.fiyat').html()) * parseInt($(this).val()));
                    });
                });
            });
        </script>


    a

    11 Mart 2014 Salı 13:31
  • alerti kaldırmak lazım ama onu debug için eklemiştik (:



    e-mail: onay[nokta]yalciner[at]hotmail[nokta]com
    MCC

    11 Mart 2014 Salı 14:21
    Moderatör