Can somebody help me? I have question. I have view, name is pascasarjana.php
<div class="form-group">
<label>Program studi dan konsentrasi yang diminati</label><br/>
<input name="prodis" type="checkbox" value="p1">Program Studi Magister Manajemen<br/>
</div>
<div class="form-group">
<input name="prodis" type="checkbox" value="p2">Program Studi Magister Teknik Sipil
<select name="konsentrasi" class="form-control" id="konsentrasi1">
<option value="">Pilih Konsentrasi</option>
<option value="k1">Manajemen Konstruksi</option>
<option value="k2">Transportasi</option>
<option value="k3">Struktur</option>
</select>
</div>
<div class="form-group">
<input name="prodis" type="checkbox" value="p3">Program Studi Magister Ilmu Hukum
<select name="konsentrasi" class="form-control" id="konsentrasi2">
<option value="">Pilih Konsentrasi</option>
<option value="k4">Hukum Bisnis</option>
<option value="k5">Hukum Ketatanegaraan</option>
<option value="k6">Hukum Agraria</option>
<option value="k7">Litigasi</option>
</select>
</div>
<div class="form-group">
<input name="prodis" type="checkbox" value="p4">Program Studi Magister Teknik Informatika
<select name="konsentrasi" class="form-control" id="konsentrasi3">
<option value="">Pilih Konsentrasi</option>
<option value="k8">Soft Computing</option>
<option value="k9">Enterprise Information System</option>
<option value="k10">Mobile Computing</option>
</select>
</div>
<div class="form-group">
<input name="prodis" type="checkbox" value="p5">Program Studi Magister Teknik Arsitektur
<select name="konsentrasi" class="form-control" id="konsentrasi4">
<option value="">Pilih Konsentrasi</option>
<option value="k11">Arsitektur Digital</option>
</select>
</div>
AND I confused, how to insert multiple checkbox and select option data to database in my controller and model.
Try renaming your HTML entities as arrays
Eg.
input name="prodis" to input name="prodis[]"
select name="konsentrasi" to select name="konsentrasi[]"
Then print $_POST in your controller.
I guess you need to get data from select box on the basis of ticked checkbox.
For getting values from checkbox you need to define checkbox name as an array. In my code I am using exact indexes so we can get select box values accordingly.
I guess below first checkbox there should be another select box. Ignoring this select box (Which is actually not here), I am giving custom indexes here. Instead, we also can use like profis[] which actually auto generate indexes by incrementing it one on each occurrence in HTML
You can implement validation too. Here are modified code:
<div class="form-group">
<label>Program studi dan konsentrasi yang diminati</label><br/>
<input name="prodis[1]" type="checkbox" value="p1">Program Studi Magister Manajemen<br/>
</div>
<div class="form-group">
<input name="prodis[2]" type="checkbox" value="p2">Program Studi Magister Teknik Sipil
<select name="konsentrasi[2]" class="form-control" id="konsentrasi1">
<option value="">Pilih Konsentrasi</option>
<option value="k1">Manajemen Konstruksi</option>
<option value="k2">Transportasi</option>
<option value="k3">Struktur</option>
</select>
</div>
<div class="form-group">
<input name="prodis[3]" type="checkbox" value="p3">Program Studi Magister Ilmu Hukum
<select name="konsentrasi[3]" class="form-control" id="konsentrasi2">
<option value="">Pilih Konsentrasi</option>
<option value="k4">Hukum Bisnis</option>
<option value="k5">Hukum Ketatanegaraan</option>
<option value="k6">Hukum Agraria</option>
<option value="k7">Litigasi</option>
</select>
</div>
<div class="form-group">
<input name="prodis[4]" type="checkbox" value="p4">Program Studi Magister Teknik Informatika
<select name="konsentrasi[4]" class="form-control" id="konsentrasi3">
<option value="">Pilih Konsentrasi</option>
<option value="k8">Soft Computing</option>
<option value="k9">Enterprise Information System</option>
<option value="k10">Mobile Computing</option>
</select>
</div>
<div class="form-group">
<input name="prodis[5]" type="checkbox" value="p5">Program Studi Magister Teknik Arsitektur
<select name="konsentrasi[5]" class="form-control" id="konsentrasi4">
<option value="">Pilih Konsentrasi</option>
<option value="k11">Arsitektur Digital</option>
</select>
At controller end you can just check if index 2 $this->input->post('prodis[2]') then get the value of select box with index 2 $this->input->post('konsentrasi[2]'
You can check it dynamically by keeping code redundancy in your mind. Let me know if you face any issue.
Insert Multiple data using check box or anything on HTML.Just use array "[]".
<input name="checkbox[]" type="checkbox" value="checkbox">
<select name="select[]"></select>
Can also array values like [2],[4],[5] anythings
Thank You
public function insert()
{
//Insert second stage details for employer into database.
$Specilized_category = $this->input->post('spec_cat');
$data=array(
'Specilized_category'=>json_encode(implode(",", $Specilized_category)),
);
$this->db->insert('tbl_employer', $data);
Related
I'm bringing all the data from the database and displaying in inputs for an edit page of my CRUD, but I can't figure out how to select an option based on the data.
With inputs I know that I can just do this:
<div class="col-md-6">
<label for="razao" class="form-label">Nome Empresarial</label>
<input type="text" name="razao" value="{{$cliente->razao ?? old('razao')}}" class="form-control" id="razao">
</div>
But i can't find anything about select, and how to set an option "selected" based on the data from the database.
The select:
<div class="col-md-3">
<label for="tipoContribuinteSelectCnpj" class="form-label">Tipo de Contribuição</label>
<select class="form-control select2-single" name="tipoContribuinteCnpj" id="tipoContribuinteSelectCnpj">
<option hidden></option>
<option value="I">ICMS</option>
<option value="X">Isento</option>
<option value="N">Não Contribuinte</option>
</select>
</div>
The data saved in the database is a single char that corresponds to the value of the option of the select.
Although it looks stupid, this is how i did in case you came here from google:
<div class="col-md-3">
<label for="tipoContribuinteSelectCnpj" class="form-label">Tipo de Contribuição</label>
<select class="form-control select2-single" name="tipoContribuinteCnpj" id="tipoContribuinteSelectCnpj">
<option hidden></option>
<option value="I" #if($cliente->tipoContribuinteCnpj == "I") selected #endif>ICMS</option>
<option value="X" #if($cliente->tipoContribuinteCnpj == "X") selected #endif>Isento</option>
<option value="N" #if($cliente->tipoContribuinteCnpj == "N") selected #endif>Não Contribuinte</option>
</select>
</div>
Give this a shot:
<option value="I" {{ $cliente->tipoContribuinteCnpj == 'I' ? 'selected' : '' }}>ICMS</option>
I am trying to make it available that user select more than option:
<select class="custom-select" form-control" multiple>
#foreach($permission_maps as $permission_map)
<option value="">{{$permission_map}}</option>
#endforeach
</select>
Only one option could be selected
Change the select tag to this:
<select class="custom-select form-control" multiple>
select name attribute should have the name of table column:
<select **name ="permissions[]"** class="custom-select form-control" multiple>
here column name is permissions
<select name="inputName[]" class="custom-select" form-control" multiple>
#foreach($permission_maps as $permission_map)
<option value="">{{$permission_map}}</option>
#endforeach
</select>
i want to make dynamic form .so for that i tried foreach loop .everything going fine without select options. For making classname or id name unique i want place a index value but cant not place index value.take a look below:
<div class="form-group m-form__group row " v-for="(pack,index) in packs">
<div class="col-lg-3">
<label>SKU: #{{ index }}</label>
<input v-model="pack.sku" type="text" name="name" class="form-control m-input" placeholder="SKU">
</div>
<div class="col-lg-3">
<label>Unit:</label>
<select class="form-control select2 #{{ index }}" name="unit" v-model="pack.unit" >
<option value="0">KG</option>
<option value="1">ML</option>
<option value="2">Liter</option>
</select>
</div>
<div class="col-lg-3">
<label>Size:</label>
<input v-model="pack.size" type="number" name="name" class="form-control m-input" placeholder="Size">
</div>
<div class="col-lg-3">
<label>Barcode:</label>
<input v-model="pack.barcode" type="number" name="barcode" class="form-control m-input" placeholder="Barcode">
</div>
</div>
you need to reload select2.
html markup:
<select class="form-control select2 #{{ index }}" name="unit" v-model="pack.unit" id="unit">
<option value="0">KG</option>
<option value="1">ML</option>
<option value="2">Liter</option>
</select>
Vuejs code:
...
components: {
},
mounted() {
setTimeOut(() => {
let unit = $('#unit'); // or document.querySelector('#unit');
unit.select2();
}, 100);
},
I have a Date of Birth field in my application which does not have either of the usual identification elements like id, value, name etc. i am not sure how to identify these DOB elements and change the values of those. Could anyone help me on this.
Here's a full div portion of the HTML from the page where the DOB section is identified.
<div ng-class="{invalid:(fieldVM.$dirty || formController.$submitted) && fieldVM.$invalid}" class="jl-form-control ng-scope bday-select-input" label="Date of Birth" jl-validation-field="dateOfBirth">
<!-- ngIf: helperText -->
<div class="jl-label-wrapper">
<label for="joltForm-profileForm-dateOfBirth-input" id="joltForm-profileForm-dateOfBirth-labelStandard" ng-bind-html="label" class="jl-label ng-binding">Date of Birth</label>
<span class="jl-optional-text">(optional)</span>
</div>
<span class="error-icon"/>
<div class="inner-icon">
<input type="hidden" name="dateOfBirth" aria-required="true" required="required" id="joltForm-profileForm-dateOfBirth-input" ng-model="model.data.dateOfBirth" class="ng-pristine ng-untouched ng-invalid ng-invalid-required ng-invalid-sync-validate" tabindex="0" aria-invalid="true">
<div class="jl-layout-33-33-33">
<select jl-model="month" jl-change="checkChange(day, month, year)" jl-options="item for item in months" class="jl-select item jl-in ng-pristine ng-valid ng-touched" ng-options="item for item in months" ng-model="month" ng-change="checkChange(day, month, year)" tabindex="0" aria-invalid="false" style="transition-delay: -9999s;">
<option value="" class="" selected="selected">MM</option>
<option value="string:01" label="01">01</option>
<option value="string:02" label="02">02</option>
<option value="string:03" label="03">03</option>
<option value="string:04" label="04">04</option>
<option value="string:05" label="05">05</option>
<option value="string:06" label="06">06</option>
<option value="string:07" label="07">07</option>
<option value="string:08" label="08">08</option>
<option value="string:09" label="09">09</option>
<option value="number:10" label="10">10</option>
<option value="number:11" label="11">11</option>
<option value="number:12" label="12">12</option>
</select>
<select jl-model="day" jl-change="checkChange(day, month, year)" jl-options="item for item in days" class="jl-select item jl-in ng-pristine ng-untouched ng-valid" ng-options="item for item in days" ng-model="day" ng-change="checkChange(day, month, year)" tabindex="0" aria-invalid="false">
<option value="" class="" selected="selected">DD</option>
<option value="string:01" label="01">01</option>
<option value="string:02" label="02">02</option>
<option value="string:03" label="03">03</option>
<option value="string:04" label="04">04</option>
<option value="string:05" label="05">05</option>
<option value="string:06" label="06">06</option>
<option value="string:07" label="07">07</option>
<option value="string:08" label="08">08</option>
<option value="string:09" label="09">09</option>
<option value="number:10" label="10">10</option>
<option value="number:11" label="11">11</option>
<option value="number:12" label="12">12</option>
...
...
...
<option value="number:30" label="30">30</option>
<option value="number:31" label="31">31</option>
</select>
<select jl-model="year" jl-change="checkChange(day, month, year)" jl-options="item for item in years" class="jl-select item jl-in ng-pristine ng-untouched ng-valid" ng-options="item for item in years" ng-model="year" ng-change="checkChange(day, month, year)" tooltip="Required" tooltip-trigger="focus" tooltip-enable="(fieldVM.$dirty || formController.$submitted) && fieldVM.$invalid" tooltip-class="errorClass" tooltip-append-to-body="true" tabindex="0" aria-invalid="false">
<option value="" class="" selected="selected">YYYY</option>
<option value="number:1915" label="1915">1915</option>
<option value="number:1916" label="1916">1916</option>
...
...
...
<option value="number:2013" label="2013">2013</option>
<option value="number:2014" label="2014">2014</option>
<option value="number:2015" label="2015">2015</option>
</select>
</div>
</div>
<div class="help-block ng-binding"/>
</div>
Its an AngularJS web application.
The select elements look identifiable based on their ng-model attribute - which is "month", "day" and "year". You can locate elements using the ng-* attributes by using a CSS (or XPath) locator:
browser.select(css: 'select[ng-model="month"]').select('07')
browser.select(css: 'select[ng-model="day"]').select('31')
browser.select(css: 'select[ng-model="year"]').select('2014')
If you tend to use the ng-model a lot for identification, you should add it to the list of validate locators. This will save you from having to write CSS/XPath locators.
require 'watir-webdriver'
Watir::HTMLElement.attributes << :ng_model
browser.select(ng_model: 'month').select('07')
browser.select(ng_model: 'day').select('31')
browser.select(ng_model: 'year').select('2014')
Note that the above suggestions assume that there is only one set of month/day/year fields on the page. If there are multiple, you will need to be more specific in the locators. In this case, it looks like the encompassing div element has an identifiable class - "bday-select-input":
birthday = browser.div(class: 'bday-select-input')
birthday.select(css: 'select[ng-model="month"]').select('07')
birthday.select(css: 'select[ng-model="day"]').select('31')
birthday.select(css: 'select[ng-model="year"]').select('2014')
I am trying make a register form adn using jquery validation. I have a problem.
I want only one "warning message" for "birthday select box"..I couldnt manage this and it look terrible when i get 3x warning for each bday select box. How can i give "one" warning message if at least one box not choosed?
And my codes are below, i made it short and working for test:
<script language="JavaScript" type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script language="JavaScript" type="text/javascript" src="js/jquery.validate.js"></script>
<script>
$(document).ready(function(){
$.validator.addMethod("username", function(value, element) {
return this.optional(element) || /^[a-z0-9\_]+$/i.test(value);
}, "Username must contain only letters, numbers, or underscore.");
$("#regForm").validate();
});
</script>
</head>
<body>
<div>
<form method="post" id="regForm" action="register.php">
<div>
Name<br>
<input id="user_name" name="name" type="text" minlength="5" class="required username"/><br>
</div>
<div>
E-mail<br>
<input id="usr_email3" name="email" type="text" class="required email"/><br>
</div>
<div>
Password<br>
<input name="pass1" type="password" class="required password" minlength="5" id="pwd" /><br>
</div>
<div>
Confirm Password<br>
<input id="pwd2" name="pass2" class="required password" type="password" minlength="5" equalto="#pwd" /><br>
</div>
<div>
Birthday:
<select name="birthday_day" class="required">
<option value="">Day</option>
<option value="1" >1</option>
<option value="2" >2</option>
</select>
<select name="birthday_month" class="required">
<option value="">Month</option>
<option value="1" >January</option>
</select>
<select name="birthday_year" class="required">
<option value="">Year</option>
<option value="1900" >1900</option>
</select>
</div>
<div>
Gender:
<select name="gender" class="required">
<option value="">Choose</option>
<option value="Male">Male</option>
<option value="Female">Female</option><br /></div>
<br>
<div>
<input id="doRegister" name="doRegister" type="submit" value="Send"/>
</div>
</form>
</div>
Give an id to the div surrounding the birthday tags:
<div id="required">
Birthday:
<select name="birthday_day" class="required">
<option value="">Day</option>
<option value="1" >1</option>
<option value="2" >2</option>
</select>
<select name="birthday_month" class="required">
<option value="">Month</option>
<option value="1" >January</option>
</select>
<select name="birthday_year" class="required">
<option value="">Year</option>
<option value="1900" >1900</option>
</select>
</div>
Use the code below to apply a red border if any of the select tags are not selected:
$('#doRegister').click(function(){
var a = $('select[name="birthday_day"]').val();
var b = $('select[name="birthday_month"]').val();
var c = $('select[name="birthday_year"]').val();
if(a == '' || b == '' || c == '')
{
$('div#required').css('border', '1px solid f60f60');
}
else
{
$('div#required').css('border', 'none');
}
});
This,of course, avoids the use of the validator plugin that you're using