Hey im trying to build a simple inventory program. I have class like this :
<?php class category { public static $catoptSupplies=array( "Cleaning Supplies", "Guest Supplies", "Printing Supplies" ); public static function loopcat3() { $loop3=category::$catoptSupplies; $spnum=1; foreach ($loop3 as $prnloop3) { echo "<option value='spcat$spnum'>$prnloop3</option>"; $spnum++; } } } ?>
now i want to append rows in my table which contain select option like this:
<script> $(document).ready(function(){ var count=1; $('#addMsGDRow').click( function(){ count = count+1; var addMsGDRow ='<tr id="row'+count+'"> <td> <select style="font-size: 12px; width: 83%; text-align: center;"> <option>--Choose Category--</option> <?php echo category::loopcat3(); ?> </select> </td> <td> <select style="font-size: 12px; text-align: center;"> <option>Unit</option> <option>Meter</option> <option>Pcs</option> </select> </td> <td><input type="text" name="" style="width: 70px;"></td> <td><input type="text" name="" style="width: 140px;"></td> <td> <textarea style="width: 121px; height: 43px;"></textarea> </td> <td><input type="number" name="" style="width: 75px;" min="0"></td> <td><input type="number" name="" min="0" style="width: 100px;"></td> <td><input type="number" name="" min="0" style="width:140px;"></td> <td><button type="button" name="remove" data-row="row'+count+'" class="btn btn-danger btn-xs removemsgd">-</button></td> </tr>'; $('#tableMsGoods').append(addMsGDRow); }); $(document).on('click', '.removemsgd', function(){ var delete_row=$(this).data("row"); $('#'+delete_row).remove(); }); }); </script>
but new row wont added if call my class using normal php line. It does however add a new row if i remove the php line. So, how can i call my class in jquery ?
Advertisement
Answer
The static PHP function is called, but the problem is that it returns a string with single quotes, which happens to be the string delimiter you use in JavaScript, and so the JS string literal terminates at a place you don’t want it to end. Also, you used the line continuation character at every line in the JS string literal, but not after the PHP-generated content, so that also would break the string literal.
The easiest solution is to use the back tick character in JS to delimit your string, so it becomes a template literal. This way you don’t need the line continuation character either.
So like this:
var addMsGDRow = ` <tr id="row'+count+'"> <td> <select style="font-size: 12px; width: 83%; text-align: center;"> <option>--Choose Category--</option> <?php echo category::loopcat3(); ?> </select> </td> <td> <select style="font-size: 12px; text-align: center;"> <option>Unit</option> <option>Meter</option> <option>Pcs</option> </select> </td> <td><input type="text" name="" style="width: 70px;"></td> <td><input type="text" name="" style="width: 140px;"></td> <td> <textarea style="width: 121px; height: 43px;"></textarea> </td> <td><input type="number" name="" style="width: 75px;" min="0"></td> <td><input type="number" name="" min="0" style="width: 100px;"></td> <td><input type="number" name="" min="0" style="width:140px;"></td> <td><button type="button" name="remove" data-row="row'+count+'" class="btn btn-danger btn-xs removemsgd">-</button></td> </tr>`;