CODEWITHSUNDEEP
javascriptjqueryarraysjsoneach
Jennifer Anthony
Jennifer Anthony

Reputation: 2277

problem in use of $.each?

Values the database row units for values salam & salavat : [this values inserted by json_encode()]

salam:

[{"name_units":"salam","price_units":"74,554","checkbox_units":["minibar","mobleman"]},{"name_units":"mokhles","price_units":"4,851,269","checkbox_units":["mobleman","tv"]},{"name_units":"fadat","price_units":"85,642","checkbox_units":["minibar","mobleman","tv"]}]

salavat:

[{"name_units":"chaker","price_units":"5,452","checkbox_units":null},{"name_units":"khobe","price_units":"5,452,545","checkbox_units":["minibar","mobleman"]}]

In the example, do the following works:

EXAMPLE: DEMO1- in here work my code & DEMO2-in here just is for show all codes

First. please inserted value: sala in input => this have "tow" result, please clicked on each a of results: salam or salavat -> you see that get five output after click => salam & mokhles & fadat | chaker & khobe(In case must have three values, since we clicked on the word salam => salam & mokhles & fadat)

second. please inserted value: salam => this have one result, please clicked on result (salam) -> you see that get "three" output after click => salam & mokhles & fadat

I want in any case that is result search "five" or "three" value or "Etc.", get values name_units related with word that is click.

$('.auto_complete').keyup(function () {
    var dataObj = $(this).closest('form').serialize();
    $.ajax({
        type: "POST",
        dataType: 'json',
        //url: 'http://binboy.gigfa.com/admin/tour_foreign/auto_complete',
        url: 'auto_complete',
        data: dataObj,
        cache: false,
        success: function (data) {
            var id_name = $('.list_autobox_hotel').attr('id');
            $('.list_autobox_hotel').show().html('');
            if (data == 0) {
                $('.list_autobox_hotel').show().html('<p><b>there is no</b></p>');
            } else {
                $.each(data, function (index, value) {
                    $('<p id="' + value.name + '">' + value.name + '</p>').appendTo('.list_autobox_hotel');
                });
                //////////////////////*HERE//////////////////////
                $('.list_autobox_hotel p').click(function (e) {
                    e.preventDefault();
                    var ac = $(this).attr('id');
                    $.each(data, function (index, value) {
                        $.each(value.units, function (bu, key) {
                            alert(key.name_units);
                        });
                    });
                    $(this).remove();
                    return false;
                });
                //////////////////////HERE*//////////////////////

                $('body').click(function () {
                    $(".list_autobox_hotel p").hide().remove();
                    $('.auto_complete').val('');
                    $('.list_autobox_hotel').show().html('');
                    $('.list_autobox_hotel').css('display', 'none');
                });

            }
        },
        "error": function (x, y, z) {
            // callback to run if an error occurs
            alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
        }
    });
});

UPDATE:

for bin i done it as: (but this don't work and there is still the same problem)

$('.list_autobox_hotel p').bind("click", function (e) {
    e.preventDefault();
    var ac = $(this).attr('id');
    $.each(data, function (index, value) {
        $.each(value.units, function (bu, key) {
            alert(key.name_units);                
        });
    });
    $(this).remove();
    return false;
});

i don't understand "filter the data depending on what item you click on" and not know how is it!?

UPDATE 2

Did this is true? (but this don't work and there is alert: undefined)

$('.list_autobox_hotel p').bind("click", function (e) {
    e.preventDefault();
    var ac = $(this).attr('id');
    var ok = $.grep(data, function (e) {
        return e.name == ac;
    }).units;
    alert(ok);
    $(this).remove();
    return false;
});

Upvotes: 1

Views: 182

Answers (1)

Guffa
Guffa

Reputation: 700322

That is because your code doesn't care which item you click on, it always shows all the data anyway.

You should either bind the click event inside the loop where you add the items, so that you can use the specific data for each item, or filter the data depending on what item you click on.

Upvotes: 2

Related Questions