Bootstrap is one of the best CSS Framework widely used by developers who don’t like spend days of week for CSS coding (Most boring and difficult to maintain redundant code). Its is quite simple and flexible framework. Now developers can design light weight websites in couple of days instead of spending weeks to design website. It also provides plugins Ex, Dropdowns, Button Groups, Alerts, Process Bars and Modals.

Here Mostly developers face problem with Extensive components. Sometimes developer faces problem to pass variables in Model and save modal element values to mysql table.

Create MYSQL table as below which will be used to save modal element’s value.

CREATE TABLE IF NOT EXISTS `inward` (

  `ent_no` int(11) NOT NULL AUTO_INCREMENT,

  `inw_no` int(11) DEFAULT NULL,

  `item_code` int(11) DEFAULT NULL,

  `item_name` varchar(30) DEFAULT NULL,

  `item_rate` double DEFAULT NULL,

  `item_qty` double DEFAULT NULL,

  `item_unit` varchar(5) DEFAULT NULL,

  `item_vat` double DEFAULT NULL,

  `item_addvat` double DEFAULT NULL,

  `total` double DEFAULT NULL,

  `created_by` varchar(15) DEFAULT NULL,

  `created_date` date DEFAULT NULL,

  `edit_count` int(4) DEFAULT NULL,

  PRIMARY KEY (`ent_no`)

) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=11 ;

STEP - 1

Create webpage named index.php and import bootstrap css & JS files in header. Download Bootstrap from here.

Create Button to call modal on `onclick` event. It is formatted by bootstrap style.

<button data-id='" . $var. "' type='button' data-toggle='modal' id='edititem' class='btn btn-outline btn-warning btn-xs'>

           Launch Modal

</button>

Output

`$var` is variable that we will pass to modal. `edititem` id added to button.

Step-2

Create Modal with form and form fields item_code,rate,unit,vat,additional vat..

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

    <div class="modal-dialog">

        <div class="modal-content">

            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

                <h4 class="modal-title" id="myModalLabel">Inward Items</h4>

            </div>

            <form class="inwarditem">

                                                                           

            <fieldset>

            <div class="modal-body">

                    <input type="hidden" id="ent_no" name="ent_no" value="<?php echo $ent_no; ?>" />

                   

                    <div class="form-group">

                        <label class="form-label">Item Name</label>

                        <input class="form-control"  name="item_code" type="text" value="<?php echo $item_code; ?>"/>

                    </div>                   

                    <div class="form-group">

                        <label class="form-label">Rate</label>

                        <input class="form-control"  name="item_rate" type="text" value="<?php echo $item_rate; ?>"/>

                    </div>

                   

                    <div class="form-group">

                        <label class="form-label">Qty</label>

                        <input class="form-control"  name="item_qty" type="text" value="<?php echo $item_qty; ?>"/>

                    </div>

                   

                    <div class="form-group">

                        <label class="form-label">Unit</label>

                        <input class="form-control"  name="item_unit" type="text" value="<?php echo $item_unit; ?>"/>

                    </div>

                   

                    <div class="form-group">

                        <label class="form-label">Vat</label>

                        <input class="form-control"  name="item_vat" type="text" value="<?php echo $item_vat; ?>"/>

                    </div>

                   

                    <div class="form-group">

                        <label class="form-label">Additional Vat</label>

                        <input class="form-control"  name="item_addvat" type="text" value="<?php echo $item_addvat; ?>"/>

                    </div>

                 </div>

            </fieldset>

            </form>

           

            <div class="modal-footer">

                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

                <button type="button" id="submit-detail" class="btn btn-primary">Save changes</button>

            </div>

        </div>

        <!-- /.modal-content -->

    </div>

    <!-- /.modal-dialog -->

 </div> 

Now modal will look as

STEP-3

Insert JS code at bottom of page. It will set parameter value of variable and pass it to modal. At last it will call modal .

<script>

         $(function() {

        //twitter bootstrap script

                                       $("button#submit-detail").click(function(){

                                                                $.ajax({

                                                                type: "POST",

                                                                url: "process.php",

                                                                data: $('form.inwarditem').serialize(),

                                                                success: function(msg){

                                                                       $("#thanks").html(msg)

                                                                               

                                                                },

                                                                error: function(){

                                                                                alert("failure");

                                                                }

                                                                });

                                       });

        });

    </script>

Above Code will call on `onclick` event of button and run code of `process.php`.

`data: $('form.inwarditem').serialize(), `  pass form element’s value to page with `POST` request.

STEP-4

Now, Create webpage `process.php` and past below code in it.

<?php

        $con = mysql_connect('localhost','root','');

        mysql_select_db('account',$con) or die(mysql_error());

       

        if($_POST['inw_no']){           

            $item_code       = strip_tags($_POST['item_code']);

            $item_rate       = strip_tags($_POST['item_rate']);

            $item_unit       = strip_tags($_POST['item_unit']);

            $item_qty        = strip_tags($_POST['item_qty']);

            $item_vat        = strip_tags($_POST['item_vat']);

            $item_addvat     = strip_tags($_POST['item_addvat']);

            $q = "update inward set item_code=$item_code, item_rate=$item_rate, item_unit=$item_unit, item_qty=$item_qty, item_vat=$item_vat, item_addvat=$item_addvat  where ent_no = $ent_no";   

            mysql_query($q,$con);

        }

?>

Finally it save data to mysql table.

That’s it you data is successfully save to mysql table.

For source code with Example or any queries / doubts contact me at click here

This post help to create form used  in database operations like insertion,deletion,modification etc. in symfony. Symfony is one of the best framework used to develop web application provides great security and code redundancy. In this post we will learn how to create form in symphony. In PHP we simply create form using html and sent data to sql operation sung POST or GET. But in Symfony, we will use form element for this purpose.

STEP-1 

 First of all create symfony application and configure it with database etc. Then we will generate Bundle using below commend in which Bundle Name is `loginBundle`

cd [app. path]

Php app/console generate: bundle LoginBundle

STEP-2

Map MySQL database and create entity using below commends.

Php app/console doctrine:mapping:import LoginBundle

Php app/console doctrine:generate:entities LoginBundle

Our Login.php file at source/LoginBundle/Resources/Entity/Login.php will look like

namespace Sym\FormBundle\Entity;

use Doctrine\ORM\Mapping as ORM;

/**

 * TblCust

 */

class TblCust

{

    /**

     * @var string

     */

    private $custName;

    /**

     * @var string

     */

    private $custCity;

    /**

     * @var string

     */

    private $custAddress;

    /**

     * @var integer

     */

    private $custPhno;

    /**

     * @var integer

     */

    private $id;

    /**

     * Set custName

     *

     * @param string $custName

     * @return TblCust

     */

    public function setCustName($custName)

    {

        $this->custName = $custName;

        return $this;

    }

    /**

     * Get custName

     *

     * @return string 

     */

    public function getCustName()

    {

        return $this->custName;

    }

    /**

     * Set custCity

     *

     * @param string $custCity

     * @return TblCust

     */

    public function setCustCity($custCity)

    {

        $this->custCity = $custCity;

        return $this;

    }

    /**

     * Get custCity

     *

     * @return string 

     */

    public function getCustCity()

    {

        return $this->custCity;

    }

    /**

     * Set custAddress

     *

     * @param string $custAddress

     * @return TblCust

     */

    public function setCustAddress($custAddress)

    {

        $this->custAddress = $custAddress;

        return $this;

    }

    /**

     * Get custAddress

     *

     * @return string 

     */

    public function getCustAddress()

    {

        return $this->custAddress;

    }

    /**

     * Set custPhno

     *

     * @param integer $custPhno

     * @return TblCust

     */

    public function setCustPhno($custPhno)

    {

        $this->custPhno = $custPhno;

        return $this;

    }

    /**

     * Get custPhno

     *

     * @return integer 

     */

    public function getCustPhno()

    {

        return $this->custPhno;

    }

    /**

     * Get id

     *

     * @return integer 

     */

    public function getId()

    {

        return $this->id;

    }

}

STEP-3

Generate Form named TblCustType using below commend

Php app/console doctrine:generate:form

STEP-4

Now, we have mysql database and ready to use  then copy Yml file and past to `source/LoginBundle/Resources/config/routing.yml`

// Routing.yml

form_homepage:

    pattern:  /Form

    defaults: { _controller: FormBundle:Default:index }

STEP-5

and  Defaultcontroller.php to  `source/LoginBundle/controller/DefaultController.php`

// DefaultController.php

namespace Sym\FormBundle\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\Controller;

use Sym\FormBundle\Entity\TblCust;

use Symfony\Component\HttpFoundation\Request;

use Sym\FormBundle\Form\TblCustType;

use Symfony\Component\HttpFoundation\Response;

class DefaultController extends Controller

{

    public function indexAction(Request $request)

    {

        $tbl = new TblCust();

        $form = $this->createFormBuilder($tbl)

                ->add('custName','text',array('required'=>true))

                ->add('custCity','text',array('required'=>true))

                ->add('custAddress','text')

                ->add('custPhno','text')

                ->add('save','submit')

                ->getForm();

       $form->handleRequest($request);

       

       if($form->isValid()){

            $Tbl = new TblCust();

            $Tbl->setCustAddress($request->get('custName'));

            $Tbl->setCustCity($request->get('custCity'));

            $Tbl->setCustAddress($request->get('custAddress'));

            $em = $this->getDoctrine()->getManager();

            $em -> persist($tbl);

            $em->flush();

            return $this->render('FormBundle:Default:index.html.twig',array('message' => 'Record Inserted'));

       }

       $build['form']=$form->createView();

       return $this->render('FormBundle:Default:index.html.twig',array( 'form' => $form->createView()));

                

        

    }

}

STEP-6

Create html.twig file at sources/LoginBundle/Resources/view/Default/index.html.twig and past below code in it.

Dynamic Form Example

{% block gender_widget %}

    {% spaceless %}

        {% if form is defined%}

           

Top of Form

Bottom of Form

  

           

            {% for child in form %}

               

·                      {{ form_label(child) }}

                    {{ form_widget(child) }}

               

            {% endfor %}

           

           

        {% else %}

            {# just let the choice widget render the select tag #}

            {{ block('choice_widget') }}

        {% endif %}

    {% endspaceless %}

{% endblock %}

{% block container %}

    {%if message is defined%}

       

        {{message}}

        Back

    {%endif%}

{% endblock%}

That’s it our form is ready to use and look like below

OutPut

We can use bootstrap or CSS style to make it attractive.

For any help and issues contact me at blog.