Passing id to modal box

I want to pass id to modal box from table showing data from database so that when click on edit button then the specific information against that is appear on modal box for editing.

Here is Html for modal and table

<table class="table table-striped table-bordered bootstrap-datatable datatable responsive">
    <thead>
        <tr>
            <th>Hall Name</th>
            <th>Description</th>
            <th>Capacity</th>
            <th>Price</th>
            <th>Action</th>
        </tr>
    </thead>
    <?php foreach ($data as $item) { ?>
    <tbody>
        <tr>
            <td class="center">
                <?php echo $item->hallName; ?></td>
            <td class="center">
                <?php echo $item->description; ?></td>
            <td class="center">
                <?php echo $item->capacity; ?></td>
            <td class="center">
                <?php echo $item->price; ?></td>
            <?php $i++; ?>
            <td class="center"> <a class="btn btn-info" href="#openModal">
                    <input type="hidden" class="modalBtn" value="decre" onClick="popupwindow(this.id)" id="<?php echo $item->id;?>" />
                    <i class="glyphicon glyphicon-edit icon-white"></i>
                     Edit
                </a>
 <a class="btn btn-danger" href='<?php site_url(' admin/deleteUser/$item->id');?>' > 
                    <i class="glyphicon glyphicon-trash icon-white"></i>
                    Delete 
                </a> 
            </td>
        </tr>
</table>

below is code for Modal. Modal having form which is use for edit that specific data from table.

<div id="openModal" class="modalDialog">
    <div> <a href="#close" title="Close" class="close">X</a>

         <h2>Edit User</h2>

        <?php echo $item->id; ?>
        <?php echo form_open_multipart( 'admin/updateHall'); ?>
        <div class="box-body">
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label>Hall Name</label>
                    </div>
                </div>
                <div class="">
                    <div class="col-md-6" style="padding-bottom: 14px">
                        <input type="text" class="text-field" placeholder="Hall Name..." name="hallName" value='<?php echo $item->hallName; ?>'>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label>Description</label>
                    </div>
                </div>
                <div class="">
                    <div class="col-md-6" style="padding-bottom: 14px">
                        <textarea class="text-field" placeholder="max 250 words" name="description" value='<?php echo $item->description; ?>' style="height: 120px"></textarea>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label>Capacity</label>
                    </div>
                </div>
                <div class="">
                    <div class="col-md-6" style="padding-bottom: 14px">
                        <input type="text" class="text-field" placeholder="Max Capacity.." name="capacity" value='<?php echo $item->capacity; ?>'>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label>Price</label>
                    </div>
                </div>
                <div class="">
                    <div class="col-md-6" style="padding-bottom: 14px">
                        <input type="text" class="text-field" placeholder="Price/person.." name="price" value='<?php echo $item->price; ?>'>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label>Image</label>
                    </div>
                </div>
                <div class="">
                    <div class="col-md-6" style="padding-bottom: 14px">
                        <input type="file" name="userfile" id="upload_file">
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-offset-4 col-md-6" style="padding: 11px;text-align: center;">
                    <button type="submit" class="btn btn-primary" style="width: 108px;height: 31px;border-radius: 0px;background-color:#8cc63e;border:none" name="submit">Submit</button>
                </div>
            </div>
        </div>
        </form>
    </div>
</div>


Source: html

Leave a Reply