Page 1 of 1

Perform POST from HTML Table

Posted: Thu Dec 17, 2015 1:10 pm
by sumeetpujari
Demo Link : clean.omegakart.com
UID: admin
Pass : 123456

Under forecast Tab there is a Create Forecast form.



User will select Market from Drop Down -- This Multi Select Option , Select Production Date, Selection Sales Date
This form on Post opens up a HTML Table with Form Input.

Table Headers:
Category || Product ID || Product Name || [Dynamic Column Name populated from Drop-down Box from previous form]
Image
Category, Product ID, Product Name are populated from products table

Need to collect Input for market quantity under each column for respective market in the header.
Image
once all column are populated it should be inserted into the table production under database such that market headers are transposed to vertical list and inputs taken are appended alongside respectively for each product.

Code: Select all

<?php
   require_once dirname(__FILE__) . '/config/dbconfig.php';
   if(!$user->is_loggedin())
   {
   	$user->redirect('index.php');
   }
   $user_id = $_SESSION['user_session'];
   $stmt = $DB_con->prepare("SELECT * FROM users WHERE user_id=:user_id");
   $stmt->execute(array(":user_id"=>$user_id));
   $userRow=$stmt->fetch(PDO::FETCH_ASSOC);
   
   
   
   ?>
<!DOCTYPE html>
<html>
   <html>
      <head>
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width,initial-scale=1">
         <meta name="description" content="">
         <meta name="author" content="">
         <link rel="shortcut icon" href="images/favicon_1.ico">
         <title>Omega CRM</title>
         <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
         <link href="css/core.css" rel="stylesheet" type="text/css">
         <link href="css/components.css" rel="stylesheet" type="text/css">
         <link href="css/icons.css" rel="stylesheet" type="text/css">
         <link href="css/pages.css" rel="stylesheet" type="text/css">
         <link href="css/responsive.css" rel="stylesheet" type="text/css">
         <link href="plugins/custombox/dist/custombox.min.css" rel="stylesheet">
         <link href="plugins/timepicker/bootstrap-timepicker.min.css" rel="stylesheet">
         <link href="plugins/mjolnic-bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css" rel="stylesheet">
         <link href="plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css" rel="stylesheet">
         <link href="plugins/clockpicker/dist/jquery-clockpicker.min.css" rel="stylesheet">
         <link href="plugins/bootstrap-daterangepicker/daterangepicker.css" rel="stylesheet">
         <link href="plugins/bootstrap-tagsinput/dist/bootstrap-tagsinput.css" rel="stylesheet" />
         <link href="plugins/switchery/dist/switchery.min.css" rel="stylesheet" />
         <link href="plugins/multiselect/css/multi-select.css"  rel="stylesheet" type="text/css" />
         <link href="plugins/select2/select2.css" rel="stylesheet" type="text/css" />
         <link href="plugins/bootstrap-select/dist/css/bootstrap-select.min.css" rel="stylesheet" />
         <link href="plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.min.css" rel="stylesheet" />
         <!--[if lt IE 9]><script src="https$//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
         <script src="https$//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script><![endif]-->
         <script src="js/modernizr.min.js"></script>	 
      </head>
      <body class="fixed-left">
         <div id="wrapper">
         <div class="topbar">
            <?php include_once dirname(__FILE__) . '/includes/topbarleft.php'; ?>
            <div class="navbar navbar-default" role="navigation">
               <div class="container">
                  <div class="">
                     <?php include_once dirname(__FILE__) . '/includes/topbarpullleft.php'; ?>
                     <?php include_once dirname(__FILE__) . '/includes/topbarright.php'; ?>
                     <div class="left side-menu">
                        <div class="sidebar-inner slimscrollleft">
                           <div class="user-details">
                              <div class="pull-left">
                                 <img src="images/users/avatar-1.jpg" alt="" class="thumb-md img-circle">
                              </div>
                              <div class="user-info">
                                 <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><?php echo $userRow['user_first_name'] ?></a>
                                 <p class="text-muted m-0"><?php echo $userRow['user_department'] ?></p>
                              </div>
                           </div>
                           <div id="sidebar-menu">
                              <ul>
                                 <?php include_once dirname(__FILE__) . '/includes/menu.php'; ?>
                                 <?php
                                    if($userRow['user_department']=="sales" || $userRow['user_role']=="Admin")
                                    	{
                                    ?>
                                 <?php include_once dirname(__FILE__) . '/includes/salesmenu.php'; ?>
                                 <?php
                                    }
                                    ?>
                                 <?php
                                    if($userRow['user_department']=="production" || $userRow['user_role']=="Admin")
                                    	{
                                    ?>
                                 <?php include_once dirname(__FILE__) . '/includes/productionmenu.php'; ?>
                                 <?php
                                    }
                                    ?>
                                 <?php
                                    if($userRow['user_department']=="marketing" || $userRow['user_role']=="Admin")
                                    	{
                                    ?>
                                 <?php include_once dirname(__FILE__) . '/includes/forcastingmenu.php'; ?>
                                 <?php
                                    }
                                    ?>
                                 <?php
                                    if($userRow['user_role']=="Admin")
                                    	{
                                    ?>
                                 <?php include_once dirname(__FILE__) . '/includes/menuadmin.php'; ?>
                                 <?php
                                    }
                                    ?>
                              </ul>
                              <div class="clearfix">
                              </div>
                              <div class="clearfix">
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
         <div class="content-page">
         <div class="content">
         <div class="container">
            <div class="row">
               <div class="col-sm-12">
                  <ol class="breadcrumb">
                     <li><a href="#">Home</a></li>
                     <li class="active">Category Forecast</li>
                  </ol>
               </div>
            </div>
            <div class="row">
               <div class="col-lg-12">
                  <?php
                     if(isset($_POST['for_post']))
                     {
                     try
                     	{
                     		?>
                  <div class="card-box" style="padding-left:5px;padding:10px;padding-bottom:50px">
                     <div class="row">
                        <div class="col-sm-12">
                           <?php
                              if(isset($_POST['for_post_market'])){ $market = $_POST['for_post_market']; } 
                              if(isset($_POST['for_post_prod_date'])){ $date_prod = $_POST['for_post_prod_date']; } 
                              if(isset($_POST['for_post_sale_date'])){ $date_sale = $_POST['for_post_sale_date']; } 
                              $query = 'SELECT * FROM product WHERE prod_status="Active"';
                              	$stmt = $DB_con->prepare($query);
                              	$stmt->execute();
                              	while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
                              	$result[$row['prod_cat_name']][] = $row['prod_id'];
                              	
                              								}
                              ?>
                           <form method="post">
                              <table id="invoices" border="1" class="table table-striped table-bordered">
                              <thead>
                                 <col width="65">
                                 <col width="65">
                                 <th>Category</th>
                                 <th>Product ID</th>
                                 <th>Product Name</th>
                                 <th hidden="true">Production Date</th>
                                 <th hidden="true">Sales Date</th>
                                 <?php
                                    $a=count($market);
                                    for($i=0;$i<$a;$i++)
                                    		{
                                    	echo '<th><input type="hidden" value="'. $market[$i] . '">'. $market[$i] .'</th>';
                                    	
                                    		}
                                    		
                                    		?>
                              </thead>
                              <tbody>
                                 <?php
                                    foreach($result as $id => $invoices) {
                                    echo '<tr>';
                                    echo '<td rowspan='. count($invoices) . '>' . $id . '</td>';
                                    	$count = 0;
                                    		foreach ($invoices as $invoice) {
                                    			if ($count != 0) {
                                    		echo '<tr>';
                                    				}
                                    				$count++;
                                    				
                                    				
                                    		echo '<td>' . $invoice . '</td>';
                                    		?>
                                 <?php 
                                    $psql = $DB_con->prepare("SELECT * FROM product WHERE prod_id='$invoice'");
                                    $psql->execute();
                                    $resultpro = $psql->fetchall(PDO::FETCH_ASSOC);
                                    foreach($resultpro as $line) {
                                    }
                                    ?>
                                 <td><?php echo $line['prod_name']; ?></td>
                                 <?php
                                    echo '<td hidden="true">' . $date_prod . '</td>';
                                    echo '<td hidden="true">' . $date_sale . '</td>';
                                    $a=count($market);
                                    for($j=0;$j<$a;$j++)
                                    	{
                                    echo '<td><input type="text" name="'. $market[$j].$invoice .' "class="form-control" maxlength="6" size="4"></td>';
                                    
                                    	}
                                    								}
                                    							}
                                    echo '</tbody>';
                                    echo '</table>';
                                    ?>
                                 <button type="submit" class="btn btn-default waves-effect waves-light" name="btn-saveforcast" id="btn-saveforcast">Save</button>
                                 <?php
                                    if(isset($_POST['btn-saveforcast']))
                                    {
                                    	try{
                                    	
                                    	foreach ($invoices as $i){
                                    	foreach( $market as $m ) {
                                    		$forcast_qtys = $_POST[$m.$i]; 
                                    			foreach( $forcast_qtys as $q) {
                                    			
                                    									
                                    									echo $q;
                                    								$result1 = $DB_con->prepare("INSERT INTO test(test) VALUES ($q)");
                                    								$result1->execute();																											
                                    										}
                                    										}
                                    							}
                                    	}
                                    	catch(PDOException $e)
                                    		{
                                    			echo $e->getMessage();
                                    			echo "<script type='text/javascript'>alert('$e')</script>";
                                    		}
                                    }
                                    }
                                    catch(PDOException $e)
                                    {
                                    echo $e->getMessage();
                                    }
                                    
                                    }
                                    else
                                    { 					?>
                           </form>
                        </div>
                     </div>
                  </div>
                  <div class="card-box" style="padding-left:5px;padding:10px;padding-bottom:500px">
                  <div class="row">
                  <div class="col-sm-12">
                  <form class="form-inline" method="post">
                  <div class="form-group m-r-10">
                  <label for="exampleInputName2">Market : </label>
                  <div class="input-group">
                  <select class="selectpicker" multiple data-selected-text-format="count" data-style="btn-white" name="for_post_market[]">
                  <?php
                     $stmt = $DB_con->prepare('Select * from location');
                     $stmt->execute();
                     	while($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
                     	echo '<option>'.$row['location_name'].'</option>';
                     												 }
                     ?>
                  </select>
                  <div>
                  &nbsp
                  <div class="form-group m-r-10">
                  <label for="exampleInputEmail2">Production Date : </label>
                  <div class="input-group">
                  <input type="text" class="form-control" placeholder="mm/dd/yyyy" id="datepicker-autoclose" name="for_post_prod_date">
                  <span class="input-group-addon bg-custom b-0 text-white"><i class="icon-calender"></i></span>
                  </div>
                  </div>
                  <div class="form-group m-r-10">
                  <label for="exampleInputEmail2">Sales Date : </label>
                  <div class="input-group">
                  <input type="text" class="form-control" placeholder="mm/dd/yyyy" id="datepicker2-autoclose" name="for_post_sale_date">
                  <span class="input-group-addon bg-custom b-0 text-white"><i class="icon-calender"></i></span>
                  </div>
                  </div>
                  <button type="submit" class="btn btn-default waves-effect waves-light btn-md" id="for_post" name="for_post">
                  Submit
                  </button>
                  </form>	
                  <?php
                     ?>
                  </div>
                  </div>
                  </div>
                  </div>
                  </div>
                  </div>
                  <?php
                     }
                     ?>
               </div>
            </div>
         </div>
         <div id="custom-modal" class="modal-demo">
         <button type="button" class="close" onclick="Custombox.close()"><span>&times;</span><span class="sr-only">Close</span></button>
         <h4 class="custom-modal-title">Add New Category</h4>
         <div class="custom-modal-text text-left">
         <form role="form" action="createcat.php">
         <div class="form-group">
         <label for="name">Category Name</label>
         <input type="text" class="form-control" id="cat_name" name="cat_name" placeholder="Enter category name">
         </div>
         <button type="submit" class="btn btn-default waves-effect waves-light" name="btn-savecat" id="btn-savecat">Save</button>
         <button type="button" class="btn btn-danger waves-effect waves-light m-l-10">Cancel</button>
         <?php
            if(isset($_GET['cat_name']))
            			{	
            				try
            					{
            							$id=$_GET['cat_name'];
            							$result = $DB_con->prepare("INSERT INTO category(cat_name,cat_status) 
            							VALUES(:userid,'Active')");
            							$result->bindParam(':userid', $id);
            							$result->execute();
            							
            						
            					}
            				catch(PDOException $e)
            					{
            						echo $e->getMessage();
            					}											
            			}	
            ?>
         </form>
         </div>
         </div>
         <script>var resizefunc = [];</script>
         <script src="js/jquery.min.js"></script>
         <script src="js/bootstrap.min.js"></script>
         <script src="js/detect.js"></script>
         <script src="js/fastclick.js"></script>
         <script src="js/jquery.slimscroll.js"></script>
         <script src="js/jquery.blockUI.js"></script>
         <script src="js/waves.js"></script>
         <script src="js/wow.min.js"></script>
         <script src="js/jquery.nicescroll.js"></script>
         <script src="js/jquery.scrollTo.min.js"></script>
         <script src="js/jquery.core.js"></script>
         <script src="js/jquery.app.js"></script>
         <script src="plugins/custombox/dist/custombox.min.js"></script>
         <script src="plugins/custombox/dist/legacy.min.js"></script>
         <script src="plugins/moment/moment.js"></script>
         <script src="plugins/timepicker/bootstrap-timepicker.min.js"></script>
         <script src="plugins/mjolnic-bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js"></script>
         <script src="plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
         <script src="plugins/clockpicker/dist/jquery-clockpicker.min.js"></script>
         <script src="plugins/bootstrap-daterangepicker/daterangepicker.js"></script>
         <script src="plugins/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script>
         <script src="plugins/switchery/dist/switchery.min.js"></script>
         <script type="text/javascript" src="plugins/multiselect/js/jquery.multi-select.js"></script>
         <script type="text/javascript" src="plugins/jquery-quicksearch/jquery.quicksearch.js"></script>
         <script src="plugins/select2/select2.min.js" type="text/javascript"></script>
         <script src="plugins/bootstrap-select/dist/js/bootstrap-select.min.js" type="text/javascript"></script>
         <script src="plugins/bootstrap-filestyle/src/bootstrap-filestyle.min.js" type="text/javascript"></script>
         <script src="plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.min.js" type="text/javascript"></script>
         <script src="plugins/bootstrap-maxlength/bootstrap-maxlength.min.js" type="text/javascript"></script>
         <script>
            jQuery(document).ready(function() {
            
            	// Time Picker
            	jQuery('#timepicker').timepicker({
            		defaultTIme : false
            	});
            	jQuery('#timepicker2').timepicker({
            		showMeridian : false
            	});
            	jQuery('#timepicker3').timepicker({
            		minuteStep : 15
            	});
            	
            	//colorpicker start
            
                         $('.colorpicker-default').colorpicker({
                             format: 'hex'
                         });
                         $('.colorpicker-rgba').colorpicker();
                         
                         // Date Picker
                         jQuery('#datepicker').datepicker();
                         jQuery('#datepicker-autoclose').datepicker({
                         	autoclose: true,
                         	todayHighlight: true
                         });
            	jQuery('#datepicker2-autoclose').datepicker({
                         	autoclose: true,
                         	todayHighlight: true
                         });
                         jQuery('#datepicker-inline').datepicker();
                         jQuery('#datepicker-multiple-date').datepicker({
                             format: "mm/dd/yyyy",
            		clearBtn: true,
            		multidate: true,
            		multidateSeparator: ","
                         });
                         jQuery('#date-range').datepicker({
                             toggleActive: true
                         });
                         
                         //Clock Picker
                         $('.clockpicker').clockpicker({
                         	donetext: 'Done'
                         });
                         
                         $('#single-input').clockpicker({
            	    placement: 'bottom',
            	    align: 'left',
            	    autoclose: true,
            	    'default': 'now'
            	});
            	$('#check-minutes').click(function(e){
            	    // Have to stop propagation here
            	    e.stopPropagation();
            	    $("#single-input").clockpicker('show')
            	            .clockpicker('toggleView', 'minutes');
            	});
            	
            	
            	//Date range picker
            	$('.input-daterange-datepicker').daterangepicker({
            		buttonClasses: ['btn', 'btn-sm'],
                       applyClass: 'btn-default',
                       cancelClass: 'btn-white'
            	});
                   $('.input-daterange-timepicker').daterangepicker({
                       timePicker: true,
                       format: 'MM/DD/YYYY h:mm A',
                       timePickerIncrement: 30,
                       timePicker12Hour: true,
                       timePickerSeconds: false,
                       buttonClasses: ['btn', 'btn-sm'],
                       applyClass: 'btn-default',
                       cancelClass: 'btn-white'
                   });
                   $('.input-limit-datepicker').daterangepicker({
                       format: 'MM/DD/YYYY',
                       minDate: '06/01/2015',
                       maxDate: '06/30/2015',
                       buttonClasses: ['btn', 'btn-sm'],
                       applyClass: 'btn-default',
                       cancelClass: 'btn-white',
                       dateLimit: {
                           days: 6
                       }
                   });
            
                   $('#reportrange span').html(moment().subtract(29, 'days').format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
            
                   $('#reportrange').daterangepicker({
                       format: 'MM/DD/YYYY',
                       startDate: moment().subtract(29, 'days'),
                       endDate: moment(),
                       minDate: '01/01/2012',
                       maxDate: '12/31/2015',
                       dateLimit: {
                           days: 60
                       },
                       showDropdowns: true,
                       showWeekNumbers: true,
                       timePicker: false,
                       timePickerIncrement: 1,
                       timePicker12Hour: true,
                       ranges: {
                           'Today': [moment(), moment()],
                           'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                           'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                           'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                           'This Month': [moment().startOf('month'), moment().endOf('month')],
                           'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
                       },
                       opens: 'left',
                       drops: 'down',
                       buttonClasses: ['btn', 'btn-sm'],
                       applyClass: 'btn-default',
                       cancelClass: 'btn-white',
                       separator: ' to ',
                       locale: {
                           applyLabel: 'Submit',
                           cancelLabel: 'Cancel',
                           fromLabel: 'From',
                           toLabel: 'To',
                           customRangeLabel: 'Custom',
                           daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
                           monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
                           firstDay: 1
                       }
                   }, function (start, end, label) {
                       console.log(start.toISOString(), end.toISOString(), label);
                       $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
                   });
            	
            });
         </script>
         <script>
            jQuery(document).ready(function() {
            
                //advance multiselect start
                $('#my_multi_select3').multiSelect({
                    selectableHeader: "<input type='text' class='form-control search-input' autocomplete='off' placeholder='search...'>",
                    selectionHeader: "<input type='text' class='form-control search-input' autocomplete='off' placeholder='search...'>",
                    afterInit: function (ms) {
                        var that = this,
                            $selectableSearch = that.$selectableUl.prev(),
                            $selectionSearch = that.$selectionUl.prev(),
                            selectableSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selectable:not(.ms-selected)',
                            selectionSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selection.ms-selected';
            
                        that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
                            .on('keydown', function (e) {
                                if (e.which === 40) {
                                    that.$selectableUl.focus();
                                    return false;
                                }
                            });
            
                        that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
                            .on('keydown', function (e) {
                                if (e.which == 40) {
                                    that.$selectionUl.focus();
                                    return false;
                                }
                            });
                    },
                    afterSelect: function () {
                        this.qs1.cache();
                        this.qs2.cache();
                    },
                    afterDeselect: function () {
                        this.qs1.cache();
                        this.qs2.cache();
                    }
                });
            
                // Select2
                $(".select2").select2();
                
                $(".select2-limiting").select2({
            maximumSelectionLength: 2
            });
            
            $('.selectpicker').selectpicker();
             $(":file").filestyle({input: false});
             });
             
             //Bootstrap-TouchSpin
             $(".vertical-spin").TouchSpin({
              verticalbuttons: true,
              verticalupclass: 'ion-plus-round',
              verticaldownclass: 'ion-minus-round'
            });
            var vspinTrue = $(".vertical-spin").TouchSpin({
              verticalbuttons: true
            });
            if (vspinTrue) {
              $('.vertical-spin').prev('.bootstrap-touchspin-prefix').remove();
            }
            
            $("input[name='demo1']").TouchSpin({
              min: 0,
              max: 100,
              step: 0.1,
              decimals: 2,
              boostat: 5,
              maxboostedstep: 10,
              postfix: '%'
            });
            $("input[name='demo2']").TouchSpin({
              min: -1000000000,
              max: 1000000000,
              stepinterval: 50,
              maxboostedstep: 10000000,
              prefix: '$'
            });
            $("input[name='demo3']").TouchSpin();
            $("input[name='demo3_21']").TouchSpin({
              initval: 40
            });
            $("input[name='demo3_22']").TouchSpin({
              initval: 40
            });
            
            $("input[name='demo5']").TouchSpin({
              prefix: "pre",
              postfix: "post"
            });
            $("input[name='demo0']").TouchSpin({});
            
            
            //Bootstrap-MaxLength
            $('input#defaultconfig').maxlength()
            
            $('input#thresholdconfig').maxlength({
                threshold: 20
            });
            
            $('input#moreoptions').maxlength({
                alwaysShow: true,
                warningClass: "label label-success",
                limitReachedClass: "label label-danger"
            });
            
            $('input#alloptions').maxlength({
                alwaysShow: true,
                warningClass: "label label-success",
                limitReachedClass: "label label-danger",
                separator: ' out of ',
                preText: 'You typed ',
                postText: ' chars available.',
                validate: true
            });
            
            $('textarea#textarea').maxlength({
                alwaysShow: true
            });
            
            $('input#placement') .maxlength({
                    alwaysShow: true,
                    placement: 'top-left'
                });
         </script>
      </body>
   </html>
Edit: I am not able to post the values from Input Box o database, Not Sure what is missing now going though the loops. If someone can guide me here it would be really great

PS: Missed out on the Question Sorry.

Re: Perform POST from HTML Table

Posted: Thu Dec 17, 2015 1:28 pm
by Celauran
Is there a question in there?

Re: Perform POST from HTML Table

Posted: Thu Dec 17, 2015 2:43 pm
by sumeetpujari
Sorry Missed out that part in whole explanation Updated that.

Re: Perform POST from HTML Table

Posted: Fri Dec 18, 2015 5:39 pm
by Christopher
Which specific form input is causing the problem? Please post just the code that is the problem.