Динамическое добавление поля с php-обработкой - PHP

Tyoma5891 · 18.03.2014, 16:39

Добрый день, коллеги!

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

вот моя функция jquery:
CODE (javascript):
скопировать код в буфер обмена

Код:

var total = 0;
function add_new_image(){
   total++;
   $('<tr>').attr('id','tr_image_'+total)
   //.css({lineHeight:'20px'})
   .append (
       $('<td>')
      // .attr('id','td_title_'+total)
       //.css({paddingRight:'5px',width:'200px'})
       .append(
                        $('<select>')
                        .attr('name','tip'+total)
               
       )                              
                               
    )
        .append (
       $('<td>')
           .append(
           $('<input type="text" />')
          // .css({width:'200px'})
           .attr('id','input_title_'+total)
           .attr('name','input_title_'+total)
                )
           
        )
    .append(
        $('<td>')
        //.css({width:'60px'})
        .append(
           $('<span id="progress_'+total+'" class="padding5px"><input type="button" value="удалить" onclick="$(\'#tr_image_'+total+'\').remove();" class="ico_delete"></span>')
         )
     )
     .appendTo('#table_container');                
}
$(document).ready(function() {
    add_new_image();
});

но проблема в том что эти селекты формируются в пхп:
CODE (html):
скопировать код в буфер обмена

Код:

<td>
                <select name="tolsh">
                <?php
                        $res = mysql_query ("SELECT tolsh from ishodnue");
                        while ($row=mysql_fetch_array($res, MYSQL_ASSOC))
                        {
                                echo "<option value=".$row['tolsh'].">".$row['tolsh']."</option>";
                        }
                ?>
                </select>
                </td>

так вот когда я вставляю в свою функцию jquery function add_new_image() этот код пхп то ничего не работает естественно, как мне это обойти может я не так что-то делаю..
CODE (javascript):
скопировать код в буфер обмена

Код:

 .append(
                        $('<select>')
                        .attr('name','tip'+total)
 
                $('<?php
                        $res = mysql_query ("SELECT tolsh from ishodnue");
                        while ($row=mysql_fetch_array($res, MYSQL_ASSOC))
                        {
                                echo "<option value=".$row['tolsh'].">".$row['tolsh']."</option>";
                        }
                ?>')
       )

ATL · 18.03.2014, 16:50

Разбейте эту замечательную функцию на несколько составляющих.

PHP код:


			
$('<tr>').attr('id','tr_image_'+tot al).append($('<td>').append($('<select>').attr('name','tip'+total))).append ($('<td>').append($('<input type="text" />').attr('id','input_title_'+total).attr('name','input_title_'+total))).append($('<td>').append(
$('<span id="progress_'+total+'" class="padding5px"><input type="button" value="удалить" onclick="$(\'#tr_image_'+total+'\') .remove();" class="ico_delete"></span>'))).appendTo('#table_container');

Как минимум из-за пропущенных кавычек она не работает. В целом - в ней бардак.

Tyoma5891 · 18.03.2014, 17:03

Цитата:

Сообщение от ATL

Разбейте эту замечательную функцию на несколько составляющих.

PHP код:


			
$('<tr>').attr('id','tr_image_'+tot al).append($('<td>').append($('<select>').attr('name','tip'+total))).append ($('<td>').append($('<input type="text" />').attr('id','input_title_'+total).attr('name','input_title_'+total))).append($('<td>').append(

$('<span id="progress_'+total+'" class="padding5px"><input type="button" value="удалить" onclick="$(\'#tr_image_'+total+'\') .remove();" class="ico_delete"></span>'))).appendTo('#table_container');

Как минимум из-за пропущенных кавычек она не работает. В целом - в ней бардак.

Нет она работает все отлично, только я не знаю как пхп-код вставить в нее в селект понимаете, у меня селекты динамически изменяются если в базе меняют значения или добавляют или удаляют?

Tyoma5891 · 18.03.2014, 23:53

Попробую пояснить ещё раз:
проблема вся в том у меня селекты в форме генерируются динамически вот код всей страницы:

Код HTML:

<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="expires" content="0">
  <script src="js/jquery.js"></script>
  

</HEAD>
<BODY>
<H3>Ввод расчетных данных для профнастила.</H3>
<form id="myForm" action="index.php?solve" method="post">
<table border="1" width="100%">
    <tr>
        <td>Тип профнастила</td>
        <td>Толщина</td>
        <td>Колличество</td>
        <td>Ширина</td>
        <td>Высота</td>
		<td>Действие</td>
    </tr>
	<div id="results"></div>
	<tr>
		<td>
		<select name="tip">
		<?php
			$res = mysql_query ("SELECT tip from ishodnue");
			while ($row=mysql_fetch_array($res, MYSQL_ASSOC))
			{
				echo "<option value=".$row['tip'].">".$row['tip']."</option>";
			}
		?>
		</select>
		</td>
		<td>
		<select name="tolsh">
		<?php
			$res = mysql_query ("SELECT tolsh from ishodnue");
			while ($row=mysql_fetch_array($res, MYSQL_ASSOC))
			{
				echo "<option value=".$row['tolsh'].">".$row['tolsh']."</option>";
			}
		?>
		</select>
		</td>
		<td><input type="text" name="quant" value=""/></td>
		<td><input type="text" name="width" value=""/></td>
		<td><input type="text" name="height" value=""/></td>
		<td><input type="submit" name="del" value="удалить"/></td>
	</tr>
	
</table>
<br>
<input type="submit" value="Посчитать"/>
</form>	
<div align="right">
<form action="index.php?add" method="post">
<input type="submit" name="add" value="Добавить">
</form>
</div>
<form action="index.php" method="post">
<input type="submit" value="Cancel">
</form>
</BODY>
</HTML>

как сделать чтоб эта строка в таблице динамически добавлялась при нажатии кнопки добавить:

Код HTML:

<tr>
		<td>
		<select name="tip">
		<?php
			$res = mysql_query ("SELECT tip from ishodnue");
			while ($row=mysql_fetch_array($res, MYSQL_ASSOC))
			{
				echo "<option value=".$row['tip'].">".$row['tip']."</option>";
			}
		?>
		</select>
		</td>
		<td>
		<select name="tolsh">
		<?php
			$res = mysql_query ("SELECT tolsh from ishodnue");
			while ($row=mysql_fetch_array($res, MYSQL_ASSOC))
			{
				echo "<option value=".$row['tolsh'].">".$row['tolsh']."</option>";
			}
		?>
		</select>
		</td>
		<td><input type="text" name="quant" value=""/></td>
		<td><input type="text" name="width" value=""/></td>
		<td><input type="text" name="height" value=""/></td>
		<td><input type="submit" name="del" value="удалить"/></td>
	</tr>

кто-то же делал наверняка подобное?

Andkorol · 19.03.2014, 01:34

Рабочий прототип на скорую руку – нужно только код формирования select-ов вставить в соответствующих местах:

Код:

<?php 
if(!empty($_POST)){
    echo '<pre>';
    var_dump($_POST);
    echo '</pre>';
}
?>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form action="" method="post">
<table class="parameters-table">
    <tr>
        <th>Type</th>
        <th>Depth</th>
        <th>Width</th>
        <th>Height</th>
        <th>Quantity</th>
        <th></th>
    </tr>
    <tr class="parameters" id="parameters_1">
        <td>
            <select name="type[]">
                <option value="type_1">Type 1</option>
                <option value="type_2">Type 2</option>
                <option value="type_3">Type 3</option>
                <option value="type_4">Type 4</option>
            </select>
        </td>
        <td>
            <select name="depth[]">
                <option value="1">1 mm</option>
                <option value="2">2 mm</option>
                <option value="3">3 mm</option>
                <option value="4">4 mm</option>
            </select>
        </td>
        <td>
            <input type="text" name="width[]" value=""/>
        </td>
        <td>
            <input type="text" name="height[]" value=""/>
        </td>
        <td>
            <input type="text" name="quant[]" value=""/>
        </td>
        <td>
            <button type="button" class="del-button" id="del_1" onclick="deleteRow(this.id); return false;">Delete</button>
        </td>
    </tr>
</table>
<p>
    <button class="add-button">Add row</button>
</p>
<p>
    <input type="submit" value="Send form"/>
</p>
</form>

<script type="text/javascript">
var cnt = 2;
    $(document).ready(function(){
        // Add new row
        $('.add-button').click(function(event){
            event.preventDefault();
            var line = $('#parameters_1').html();
            var expr = /del_[0-9]+/;
            var newline = line.replace(expr, 'del_'+cnt);
            $('.parameters-table').append('<tr class="parameters" id="parameters_'+cnt+'">'+newline+'</tr>');
            cnt++;
        });
    });

    // Delete row
    function deleteRow(btn_id){
        var del_id = btn_id.split('_');
        $('#parameters_'+del_id[1]).remove();
    }
</script>

Tyoma5891 · 19.03.2014, 13:28

+1 Andkorol
буду разбиратться jquery хотя бы на таком уровне чтоб совмещать со своими задачами...
еще раз спасибо

Tyoma5891 · 13.04.2014, 12:19

У меня вопрос а как сделать так чтобы при нажатии на кнопку добавить в строке добавляемой убрать выпадающие списки (селекты), а оставить только ячейки с инпутами?

Tyoma5891 · 14.04.2014, 11:28

Andkorol, не могли бы Вы подсказать как это сделать?

Andkorol · 14.04.2014, 13:36

Цитата:

Сообщение от Tyoma5891

Andkorol, не могли бы Вы подсказать как это сделать?

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

18.03.2014, 16:50	#2
ATL Форумчанин Регистрация: 26.01.2007 Сообщений: 278	Разбейте эту замечательную функцию на несколько составляющих. PHP код: `$('<tr>').attr('id','tr_image_'+tot al).append($('<td>').append($('<select>').attr('name','tip'+total))).append ($('<td>').append($('<input type="text" />').attr('id','input_title_'+total).attr('name','input_title_'+total))).append($('<td>').append( $('<span id="progress_'+total+'" class="padding5px"><input type="button" value="удалить" onclick="$(\'#tr_image_'+total+'\') .remove();" class="ico_delete"></span>'))).appendTo('#table_container');` Как минимум из-за пропущенных кавычек она не работает. В целом - в ней бардак.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
PHP - выгрузка вложений из почты с их дальнейшей обработкой	Chiwos	PHP	0	01.06.2012 11:05
динамическое добавление контролов	MrGB	Microsoft Office Excel	12	02.11.2010 12:29
Динамическое добавление компонентов	Vigilante	Компоненты Delphi	1	21.10.2010 01:28
Динамическое добавление в PopupMenu	k1r1ch	Общие вопросы Delphi	1	02.10.2009 10:29
Динамическое добавление в страницу	Dj_smart	HTML и CSS	11	26.05.2008 22:28

19.03.2014, 13:28	#6
Tyoma5891 Пользователь Регистрация: 16.08.2013 Сообщений: 54	+1 Andkorol буду разбиратться jquery хотя бы на таком уровне чтоб совмещать со своими задачами... еще раз спасибо

13.04.2014, 12:19	#7
Tyoma5891 Пользователь Регистрация: 16.08.2013 Сообщений: 54	У меня вопрос а как сделать так чтобы при нажатии на кнопку добавить в строке добавляемой убрать выпадающие списки (селекты), а оставить только ячейки с инпутами?

14.04.2014, 11:28	#8
Tyoma5891 Пользователь Регистрация: 16.08.2013 Сообщений: 54	Andkorol, не могли бы Вы подсказать как это сделать?