Array'den gelen veriyi Selectten seçip İnput a yazdırmak nasıl yaparım

06-09-2019, 12:33:57

PhYtOnX

Başlıkta anlatamamış olabilirim alttaki kodları yazdım ama bir yerde tıkandım.

Alttaki arrayde olan ucret kısmını "islem_ucret" kısmına yazdırmam laızm.

PHP

$parcalar = array(
array( 'id'=> 1, 'parca'=>'ekran', 'ucret'=>'20' ),
array( 'id'=> 2, 'parca'=>'tuş', 'ucret'=>'30' ),
array( 'id'=> 3, 'parca'=>'zil', 'ucret'=>'50' ),
array( 'id'=> 4, 'parca'=>'film', 'ucret'=>'25' ),
array( 'id'=> 5, 'parca'=>'duy', 'ucret'=>'10' )
);

HTML

<div class="form-group row IslemlerGroup">
    <div class="col-sm-3">
        <select name="parca[]" class="form-control fill">
            <option value="opt1">Parça Seçin</option>
            <?php foreach ($parcalar as $key => $parca) { ?>
            <option value="<?=$parca['id']; ?>"><?=$parca['parca']; ?></option>
            <?php } ?>
        </select>
    </div>
    <div class="col-sm-3">
        <input type="text" name="islem_ucret[]" class="form-control" placeholder="Ücret" pattern="d">
    </div>
    <div class="col-sm-5">
        <input type="text" name="islem_aciklama[]" class="form-control" placeholder="Açıklama">
    </div>
    <div class="col-sm-1">
        <button class="btn btn-mat waves-effect waves-light btn-success btn-sm GelirCogaltBtn">Ekle</button>
    </div>
</div>

<div class="form-group IslemlerGroupKopya" style="display: none;">
    <div class="row">
        <div class="col-sm-3">
            <select name="parca[]" class="form-control fill">
                <option value="opt1">Parça Seçin</option>
                <?php foreach ($parcalar as $key => $parca) { ?>
                <option value="<?=$parca['id']; ?>"><?=$parca['parca']; ?></option>
                <?php } ?>
            </select>
        </div>
        <div class="col-sm-3">
            <input type="text" name="islem_ucret[]" class="form-control" placeholder="Ücret" pattern="d">
        </div>
        <div class="col-sm-5">
            <input type="text" name="islem_aciklama[]" class="form-control" placeholder="Açıklama">
        </div>
        <div class="col-sm-1">
            <button class="btn btn-mat waves-effect waves-light btn-danger btn-sm remove">Sil</button>
        </div>
    </div>
</div>
</div>

JQUERY

$(document).ready(function(){
var maxGroup = 1000;
$(".GelirCogaltBtn").click(function(){
if($('body').find('.IslemlerGroup').length < maxGroup){
var fieldHTML = '<div class="form-group IslemlerGroup">'+$(".IslemlerGroupKopya").html()+'</div>';
$('body').find('.IslemlerGroup:last').after(fieldHTML);
}else{
alert('Maximum '+maxGroup+' groups are allowed.');
}
});
$("body").on("click",".remove",function(){
$(this).parents(".IslemlerGroup").remove();
});
});

06-09-2019, 12:39:57

#2

Bybitter

Sadece mantığı anlatmam gerekirse

Array verilerini foreach ile dönderip select option value kısmına değerleri yazdırın
javascript kısmında on change fonksiyonu ile her değiştiğinde select'in value sini alıp input içine yazdırın.

06-09-2019, 12:55:53

#3

PhYtOnX

Bybitter adlı üyeden alıntı: mesajı görüntüle

Sadece mantığı anlatmam gerekirse

Array verilerini foreach ile dönderip select option value kısmına değerleri yazdırın
javascript kısmında on change fonksiyonu ile her değiştiğinde select'in value sini alıp input içine yazdırın.

Array i yazdırıyorum hocam fakat jquery ya da javascript kısmında tıkandım o kısmı yapamadım.

06-09-2019, 12:59:53

#4

Bybitter

Bir anydesk iletin hocam bakalım beraber

06-09-2019, 13:58:41

#5

PhYtOnX

İş yerinde bağlantılar kapalı hocam dışarıya akşam 8 gibi müsait olma ihtimaliniz var mi

07-09-2019, 02:02:13

#6

trgino

umarım yapmak istediğini doğru anlamışımdır.

<div class="form-group row IslemlerGroup">
<div class="col-sm-3">
<select name="parca[]" class="form-control fill selecTor">
            <option value="0">Parça Seçin</option>
            <?php foreach ($parcalar as $key => $parca) { ?>
            <option value="<?=$parca['id']; ?>" data-ucret="<?=$parca['ucret'];?>"><?=$parca['parca']; ?></option>
            <?php } ?>
        </select>
</div>
<div class="col-sm-3">
<input type="text" name="islem_ucret[]" class="form-control" placeholder="Ücret" pattern="d">
</div>
<div class="col-sm-5">
<input type="text" name="islem_aciklama[]" class="form-control" placeholder="Açıklama">
</div>
<div class="col-sm-1">
<button class="btn btn-mat waves-effect waves-light btn-success btn-sm GelirCogaltBtn">Ekle</button>
</div>
</div>

<div class="form-group IslemlerGroupKopya" style="display: none;">
<form class="row" id="tempForm">
        <div class="row">
            <div class="col-sm-3">
                <select name="parca[]" class="form-control fill selecTor">
                    <option value="0">Parça Seçin</option>
                    <?php foreach ($parcalar as $key => $parca) { ?>
                    <option value="<?=$parca['id']; ?>" data-ucret="<?=$parca['ucret'];?>"><?=$parca['parca']; ?></option>
                    <?php } ?>
                </select>
            </div>
            <div class="col-sm-3">
                <input type="text" name="islem_ucret[]" class="form-control" placeholder="Ücret" pattern="d">
            </div>
            <div class="col-sm-5">
                <input type="text" name="islem_aciklama[]" class="form-control" placeholder="Açıklama">
            </div>
            <div class="col-sm-1">
                <button class="btn btn-mat waves-effect waves-light btn-danger btn-sm remove">Sil</button>
            </div>
</div>
</form>
</div>
<div class="IslemlerWrap"><!--buraya islemler--></div>

$(document).ready(function(){
    $('body').on('change','.selecTor',function(){
        if($(this).val()>0){
            $(this).parents('.row').find('input[name="islem_ucret[]"]').val($('option:selected', this).attr('data-ucret'));
        }
    });
    
    var maxGroup = 1000;
    $('.GelirCogaltBtn').click(function(){
        if($('.selecTorEkle').val()>0){
            if($('.IslemlerGroup').length < maxGroup){
                $('#tempForm .selector').val($('.selecTorEkle').val());
                $('#tempForm .selector').trigger('change');                
                $('.IslemlerWrap').append('<div class="form-group IslemlerGroup">'+$('#tempForm').html()+'</div>');
                $('#tempForm')[0].reset();
            }else{
                alert('Maximum '+maxGroup+' groups are allowed.');
            }
        }else{
            alert('Parça Seçiniz');
        }
    });
    $('.IslemlerWrap').on('click','.remove',function(){
        $(this).parents('.IslemlerGroup').remove();
    });
});

07-09-2019, 08:16:57

#7

PhYtOnX

trgino adlı üyeden alıntı: mesajı görüntüle

umarım yapmak istediğini doğru anlamışımdır.

<div class="form-group row IslemlerGroup">
<div class="col-sm-3">
<select name="parca[]" class="form-control fill selecTor">
            <option value="0">Parça Seçin</option>
            <?php foreach ($parcalar as $key => $parca) { ?>
            <option value="<?=$parca['id']; ?>" data-ucret="<?=$parca['ucret'];?>"><?=$parca['parca']; ?></option>
            <?php } ?>
        </select>
</div>
<div class="col-sm-3">
<input type="text" name="islem_ucret[]" class="form-control" placeholder="Ücret" pattern="d">
</div>
<div class="col-sm-5">
<input type="text" name="islem_aciklama[]" class="form-control" placeholder="Açıklama">
</div>
<div class="col-sm-1">
<button class="btn btn-mat waves-effect waves-light btn-success btn-sm GelirCogaltBtn">Ekle</button>
</div>
</div>

<div class="form-group IslemlerGroupKopya" style="display: none;">
<form class="row" id="tempForm">
        <div class="row">
            <div class="col-sm-3">
                <select name="parca[]" class="form-control fill selecTor">
                    <option value="0">Parça Seçin</option>
                    <?php foreach ($parcalar as $key => $parca) { ?>
                    <option value="<?=$parca['id']; ?>" data-ucret="<?=$parca['ucret'];?>"><?=$parca['parca']; ?></option>
                    <?php } ?>
                </select>
            </div>
            <div class="col-sm-3">
                <input type="text" name="islem_ucret[]" class="form-control" placeholder="Ücret" pattern="d">
            </div>
            <div class="col-sm-5">
                <input type="text" name="islem_aciklama[]" class="form-control" placeholder="Açıklama">
            </div>
            <div class="col-sm-1">
                <button class="btn btn-mat waves-effect waves-light btn-danger btn-sm remove">Sil</button>
            </div>
</div>
</form>
</div>
<div class="IslemlerWrap"><!--buraya islemler--></div>

$(document).ready(function(){
    $('body').on('change','.selecTor',function(){
        if($(this).val()>0){
            $(this).parents('.row').find('input[name="islem_ucret[]"]').val($('option:selected', this).attr('data-ucret'));
        }
    });
    
    var maxGroup = 1000;
    $('.GelirCogaltBtn').click(function(){
        if($('.selecTorEkle').val()>0){
            if($('.IslemlerGroup').length < maxGroup){
                $('#tempForm .selector').val($('.selecTorEkle').val());
                $('#tempForm .selector').trigger('change');                
                $('.IslemlerWrap').append('<div class="form-group IslemlerGroup">'+$('#tempForm').html()+'</div>');
                $('#tempForm')[0].reset();
            }else{
                alert('Maximum '+maxGroup+' groups are allowed.');
            }
        }else{
            alert('Parça Seçiniz');
        }
    });
    $('.IslemlerWrap').on('click','.remove',function(){
        $(this).parents('.IslemlerGroup').remove();
    });
});

Hocam ekle deyince parça seçilse bile işlem "Parça Seçiniz" çıkıyor.

Ben kod içerisinden parçalar alarak işimi hallettim sayılır sadece şu kaldı. Bir parça seçinde alta doğru açılan tüm ücret inputlarına aynı ücreti ekliyor.
Alt tarafa o işlem için kod u koydum onuda çözersem işimi halletmiş olacağım

    $('body').on('change','.parcaclass',function(){
        if($(this).val()>0){
            $(this).parents('.row').find('input[name="islem_ucret[]"]').val($('option:selected', this).attr('data-ucret'));
        }
    });

PhYtOnX adlı üyeden alıntı: mesajı görüntüle

Hocam ekle deyince parça seçilse bile işlem "Parça Seçiniz" çıkıyor.

Ben kod içerisinden parçalar alarak işimi hallettim sayılır sadece şu kaldı. Bir parça seçinde alta doğru açılan tüm ücret inputlarına aynı ücreti ekliyor.
Alt tarafa o işlem için kod u koydum onuda çözersem işimi halletmiş olacağım

    $('body').on('change','.parcaclass',function(){
        if($(this).val()>0){
            $(this).parents('.row').find('input[name="islem_ucret[]"]').val($('option:selected', this).attr('data-ucret'));
        }
    });

Onuda çözdüm hocam emeğiniz için teşekkürler

    $('body').on('change','.parcaclass',function(){
        if($(this).val()>0){
            $(this).parents(".IslemlerGroup").find('.islemucret').val($('option:selected', this).attr('data-ucret'));
        }
    });