Jquery, его возможности?

Question

[AndyLarcin]

Добрый день. Вопрос по возможностям Jquery?
Смотрите пример:

var s = '<col width="20%"><col width="20%"><col width="20%"><col width="20%"><col width="20%">';
        s += '<tr style="background-color:#ebebeb;">';
        s += '<td colspan="3" class="text_ans" align="left">'+"<?php print lang('ЖЕО ','ЖЭК ')?>"+ans['jek']+'<br/>'+"<?php print lang('о/р ','л/с ')?>"+ans['account']+'<br/>'+ans['address']+', КВ.'+ans['flat']+'</td>';
        s += '<td colspan="2" class="text_ans" align="right">'+periodstr(ans['period'])+'<br/><br/><br/></td>';
        s += '</tr>';



        s += '<tr height="8px" />';
        s += '<tr>';
		s += '<td colspan="5" align="left" class="field_text">Ваш e-mail<br/><input id="mail" class="input_box" size="30" value=""/></td>';
        s += '</tr>';
        s += '<tr height="8px" />';
        
        for (var bill_num = 0; bill_num < bill_count; bill_num++) {
            s += '<input type="hidden" id="bill_id'+bill_num+'" value="'+bill_id[bill_num]+'">';
                
            s += '<tr>';
            s += '<td colspan="1" class="text bill_title" align="left">'+"<?php print lang('РАХУНОК ','СЧЕТ ')?>"+(bill_num+1)+'</td>';
            s += '<td colspan="4" class="text bill_title" align="right">'+bill_name[bill_num]+'</td>';
            s += '</tr>';
         
            s += '<tr>';
            s += '<td colspan="2" class="text bill_detal" align="left">'+bill_bank[bill_num]+'<br/>'+"<?php print lang('код банку ','код банка ')?>"+bill_mfo[bill_num]+'<br/>'+"<?php print lang('р/р ','р/с ')?>"+bill_account[bill_num]+'</td>';
            s += '<td colspan="3" class="text bill_detal" align="right">'+bill_owner[bill_num]+'<br/>'+"<?php print lang('ЄДРПОУ ','ЕДРПОУ ')?>"+bill_edrpou[bill_num]+'<br/><br/></td>';
            s += '</tr>';
            $("#services").html(s);

Затем реализация в таблице:

<div id="pay_block" style="display:none;position:relative">
                <div class="logo" id="logo"></div>
                <div class="header"><div class="title"><?=$title;?></div></div>

                <div class="list_element" id="list_element_11" onclick="check_form2(document.pay);" onkeyup="javascript:if(13==event.keyCode){check_form2(document.pay);}"><table id="services" cellpadding=0 cellspacing=0 width="100%" style="table-layout:fixed"></table></div>

                <table class="main" width="100%" align="center" cellpadding=5 cellspacing=0>


                <tr>
                    <th class="button_area" align="right">
                        <button class="button back short" onclick="back1()" onkeyup="javascript:if(13==event.keyCode){back1();}" >Назад</button>
                        <!--<button class="button next short" onclick="check_form(document.pay);" onkeyup="javascript:if(13==event.keyCode){check_form(document.pay);}"><?php print lang('Далі','Далее')?></button>-->
                    </th>
                </tr>
                </table>
            </div>

Оно выводит скопом 3 блока, а нужно вывести только :

for (var bill_num = 0; bill_num < bill_count; bill_num++) {
            s += '<input type="hidden" id="bill_id'+bill_num+'" value="'+bill_id[bill_num]+'">';
                
            s += '<tr>';
            s += '<td colspan="1" class="text bill_title" align="left">'+"<?php print lang('РАХУНОК ','СЧЕТ ')?>"+(bill_num+1)+'</td>';
            s += '<td colspan="4" class="text bill_title" align="right">'+bill_name[bill_num]+'</td>';
            s += '</tr>';
         
            s += '<tr>';
            s += '<td colspan="2" class="text bill_detal" align="left">'+bill_bank[bill_num]+'<br/>'+"<?php print lang('код банку ','код банка ')?>"+bill_mfo[bill_num]+'<br/>'+"<?php print lang('р/р ','р/с ')?>"+bill_account[bill_num]+'</td>';
            s += '<td colspan="3" class="text bill_detal" align="right">'+bill_owner[bill_num]+'<br/>'+"<?php print lang('ЄДРПОУ ','ЕДРПОУ ')?>"+bill_edrpou[bill_num]+'<br/><br/></td>';
            s += '</tr>';
            $("#services").html(s);

Этот блок, подскажите как это сделать, буду очень благодарен.

Такого плана.

Answer 1

[Алексей Яхненко]

если честно, из вопроса не совсем понятно, как связан код из "Затем реализация в таблице:" с остальным.
но есть подозрение, что вот это
$("#services").html(s);
должно быть вне цикла for.

Comments

[AndyLarcin]

Просто там весь код в форе, это прорисовка таблицы и всех данных, суть задачи состоит в том что б разбить вывод на 2 блока в 1 блок шапка, и по нажатию шапки код строго который в этом блоке.
То есть 1 "страничка" у нас там 3 - 4 шапки, и по нажатию на одну из них там нужно видить только то что в ней, а не всю реализацию странички. Как-то так не могу придумать как решить эту проблему?

[AndyLarcin]

Если знаете как реализовать, подскажите с чего начать, а там я уже думаю сам справлюсь, Спасибо.

Answer 2

[AndyLarcin]

Просто там весь код в форе, это прорисовка таблицы и всех данных, суть задачи состоит в том что б разбить вывод на 2 блока в 1 блок шапка, и по нажатию шапки код строго который в этом блоке.
То есть 1 "страничка" у нас там 3 - 4 шапки, и по нажатию на одну из них там нужно видить только то что в ней, а не всю реализацию странички. Как-то так не могу придумать как решить эту проблему?

Comments

[Алексей Яхненко]

табы что ли надо сделать?

блин, извини конечно, но код в целом ужасен.
не стоит генерировать хтмл таким образом вообще.

генерируй на пхп, потом с помощью жс прячь ненужное, вешай обработчики на элементы по клику на которые что-то должно открываться.

ну или просто jqueryui.com/tabs

[AndyLarcin]

Алексей Яхненко: Я еще раз повторюсь, код не мой, мне дали этот проект и сказали реализовать то то и то, и разобраться в этом коде, вот я и ломаю голову сам сижу ... (

[AndyLarcin]

Алексей Яхненко: Что значит табы ? я не сильно понял Вашу идею ? по конкретней опишите, может Вы и правы.

[Алексей Яхненко]

ну вот это:
"То есть 1 "страничка" у нас там 3 - 4 шапки, и по нажатию на одну из них там нужно видить только то что в ней"

похоже на табы. если не знаете что такое табы - по ссылке что я дал сразу есть пример.

[AndyLarcin]

Алексей Яхненко: О я понял, нет не табы, скорее всего Лист Элементы, мне так кажеться.

[Алексей Яхненко]

гм. а можно скриншот примерно желаемого результата?

[AndyLarcin]

Алексей Яхненко: а как я Вам покажу здесь скрин шот ???

[Алексей Яхненко]

ссылкой, либо в текст вопроса можно вставить по идее.

[AndyLarcin]

Алексей Яхненко: сделано, смотрите

[AndyLarcin]

Алексей Яхненко: Что подскажите ?

[Алексей Яхненко]

jqueryui.com/accordion - оно?

[AndyLarcin]

Алексей Яхненко: думаю можно попробовать и этим.

[AndyLarcin]

Спасибо! Буду сейчас что-то пробовать )))

[AndyLarcin]

хотя, там ведь оно все в цыкле, как вытащить отдельные элементы, и привязать их к шапке ??

[Алексей Яхненко]

в цикле создается хтмл
потом он выводится с помощью $("#services").html(s);
твоя задача - правильно сделать разметку (читай api.jqueryui.com/accordion/) и затем вызвать конструктор аккордеона.

[AndyLarcin]

Алексей Яхненко: понял Вас, спасибо за помощь, буду сейчас разбираться.

Answer 3

[asdz]

Мне кажется если бы вы создавали дом элементы, а не конкатенировали строки в цикле, то избежали бы проблем и улучшили читабельность кода.

Comments

[AndyLarcin]

дело в том, что это не мой код, меня посадили за проект и сказали справить и сделать то и то и то.... вот я и ломаю голову сижу

[AndyLarcin]

Если знаете как реализовать, подскажите с чего начать, а там я уже думаю сам справлюсь, Спасибо.

[asdz]

Начните с постановки задачи, изучения входных данных, изучите создание дом с помощью джиквери api.jquery.com/jquery/#jQuery2 и манипуляции с дом api.jquery.com/category/manipulation , разработайте алгоритм и запрограммируйте.

[AndyLarcin]

asdz: Спасибо

Answer 4

[Сергей Мельников]

Нет, так дела не делаются, у вас там такие спагетти кода, что черт ногу сломит)

Comments

[AndyLarcin]

я понимаю, еще раз повторюсь, код не мой, дали проект сказали разберись и сделай то то и то . (((

[Сергей Мельников]

AndyLarcin: jsbin.com/wamuwo/4/edit?js,output

[AndyLarcin]

Сергей Мельников: Позвольте поинтересоваться, что это ?)))

[Сергей Мельников]

AndyLarcin: переделал этот кусок кода, используя простой шаблонизатор js, я так понимаю, вам сложно в этом разобраться?

[AndyLarcin]

Сергей Мельников: нет уже разобрался, но там просто вы не видели исходники, поэтому он малость не подходит, но я его модифицировал, Спасибо Вам !)

[Сергей Мельников]

пожалуйста

Answer 5

[A K]

Выставьте код сюда хотя б, мне лично в падлу это делать, как и многим, я думаю