CodeIgniter Forums
I need a help with changing HTML and Javascript to Codeigniter - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Using CodeIgniter (https://forum.codeigniter.com/forum-5.html)
+--- Forum: General Help (https://forum.codeigniter.com/forum-24.html)
+--- Thread: I need a help with changing HTML and Javascript to Codeigniter (/thread-137.html)



I need a help with changing HTML and Javascript to Codeigniter - Maijane - 11-05-2014


I have HTML and Javascript code which i want to use it on codeigniter.

HERE IS HTML


<tr>
<td>
<div class="editor-label">
<label for="Customer_IDType">ID Type:</label>
</div>
</td>
<td>
<div class="editor-field">
<select class="editor-dropdown" id="ddlIdType" name="Customer.IDType"><option value="SouthAfricanId">South African ID</option>
<option value="Passport">Passport</option>
</select>
<input id="Customer_DisplayPassport" name="Customer.DisplayPassport" type="hidden" value="True">

<img id="tooltipID" align="absmiddle" src="./About You_files/info-icon.jpg">
</div>
</td>
</tr>
<tr>
td>
<div class="editor-label">
<label id="lbIDValue">South African ID:</label>
</div>
<td>
<div class="editor-field">
<input class="textbox" id="txIdValue" maxlength="13" name="Customer.IDValue" type="text" value="">
</div>
</td>
</tr>
<tr>
<td>
<div class="editor-label">
<label for="Customer_DOB">Date of birth:</label>
</div>
</td>
<td>
<div class="editor-field">
<div class="editor-field">
<input class="UseDatePicker date-text-box hasDatepicker" id="Customer_DOB" name="Customer.DOB" readonly="readonly" type="text" value=""><img class="ui-datepicker-trigger" src="./About You_files/calendar.gif" alt="..." title="...">
</div>

<script type="text/javascript">
$(document).ready(function() {

$("#Customer_DOB").datepicker({
showOn: 'button',
buttonImage: "../Content/Images/calendar.gif",
//buttonImage: encodeURI("../../../../Content/Images/calendar.gif"),
//buttonImage: "../../../../Content/Images/calendar.gif",
dateFormat: 'dd MM yy',
buttonImageOnly: true,
showWeek: true,
firstDay: 1,
changeMonth: true,
changeYear: true,
yearRange: 'c-95:c+95',
minDate: new Date(1900, 1 - 1, 1)
});

//Sets the max date to 16 years prior to system date
$("#Customer_DOB").datepicker("option", "maxDate", '-16y');
});
</script>

</div>
</td>
</tr>

HERE IS JAVASCRIPT

$("#tooltipID").tooltip({
// place tooltip on the right edge
position: "center right",
// a little tweaking of the position
offset: [-2, 10],
// use the built-in fadeIn/fadeOut effect
effect: "fade",
// custom opacity setting
opacity: 0.7
});
$("#tooltipCellphone").tooltip({
// place tooltip on the right edge
position: "center right",
// a little tweaking of the position
offset: [-2, 10],
// use the built-in fadeIn/fadeOut effect
effect: "fade",
// custom opacity setting
opacity: 0.7,

});
$("#ddlIdType").change(function() {
ChangeLabelDisplay(true);
});

function verifyAddress(control) {
var pattern = new RegExp('[PO.]*\\s?B(ox)?.*\\d+', 'i');
if (control.val().match(pattern)) {
alert("Invalid residential address");
$(control).val("");
$(control).focus;
}
};
$("#txIdValue").blur(function() {
var idCombo = $("#ddlIdType").val();
var idValue = $("#txIdValue").val();
if (idValue == "") {
}
else {
var strYear = "";
var strMonth = "";
var strDay = "";
var dateFull = "";
var sValue = "";
if (idCombo == "SouthAfricanId") {
if (!isNaN(idValue)) {
strYear = "19" + idValue.substring(0, 2);
strMonth = idValue.substring(2, 4);
strDay = idValue.substring(4, 6);
dateFull = strYear + "/" + strMonth + "/" + strDay;
var d = new Date(dateFull);
if (d != "Invalid Date")
$("#Customer_DOB").datepicker("setDate", d);
else {
$("#Customer_DOB").datepicker("setDate", "");
alert("Invalid South African ID number");
}
}
else {
$("#Customer_DOB").datepicker("setDate", "");
}
}
}
});

$(function() {
$("#tabs").tabs({
event: "mouseover"
});
});

function ChangeLabelDisplay(resetValues) {
var option = $("#ddlIdType").val();
var result = "South African ID:";

if (resetValues) {
$("#txIdValue").val("");
$("#Customer_DOB").val("");
}
if (option == 'Passport')
result = "Passport Number:";

$("#lbIDValue").text(result);
}


RE: I need a help with changing HTML and Javascript to Codeigniter - Rufnex - 11-05-2014

This has nothing to do with CI .. you can simply put the hole stuff into a view file (e.g. ../views/my_template.php) and call it in the controller with

$this->load->view('my_template');

All assets stuff like js, css and images must be refered with the path in your template.