Tuesday, July 10, 2012

PHP (menambahkan data melalui form entry html)


Panduan menambahkan data melalui form entry html di PHP

Setelah kita berhasil membuat tampilan data pegawai kedalam web page employee.html langkah berikut adalah untuk melakukan penambahan data melalui form entry dengan file html, form entry akan ditampilkan pada saat kita klik tombol tambah data di file employee.html adapun langkah-langkah sbb:
  1. Aktifkan program editor Notepad++ atau PhpEditor kemudian kita buka file employee.php
  2. Tambahkan fungsi baru yaitu fungsi untuk menampilkan form entry penambahan data hingga program dapat dilihat sbb:
<?php
require_once "clsemployee.php";
$mPage = new MainPage();
$mod = $_REQUEST['mod'];

switch ($mod) {
  case 'addPos':
  $mPage -> showtambahemp();
  break;
 
  default :
  $mPage -> showlistemployee(); 
   break;
}

?>
  1. Coba perhatikan source program diatas kita sudah menambahkan perintah baru yaitu :
  case 'addPos':
  $mPage -> showtambahemp();
  break;
perintah diatas berarti kita akan membuat untuk kegiatan (modus) penambahan data dengan mod=addPos akan menjalankan fungsi showtambahemp()
  1. Berikutnya buka file clsemployee.php kemudian tambahkan fungsi baru dengan nama showtambahemp() sesuai dengan fungsi yang sudah kita deklarasikan di file employee.php kemudian fungsi lainnya yaitu buatCombojabatan() seperti tampilan berikut :
<?php
      require_once("clsUtil.php");
      class MainPage extends Util
      {
     
      function showlistemployee()
      {
                  global $db;
                  $sqlUser          = "select * from dat_personil";                      
                  $rs = $db -> Execute($sqlUser);
              if (!$rs->RecordCount())
              {
                   $kosong = 'kosong';
                   $ulist[] = array(
                                                                                                                  'no'=>$kosong,
                                          'posNIK'=>$kosong,
                                                                                                                  'posNama'=>$kosong,
                                                                                                                  'posAlamat'=>$kosong,
                                                                                                                  'posTelp'=>$kosong,
                                                                                                                  'posEmail'=>$kosong                               
                                      );
              }
              else
              {
                  $no = $index;
                  while ($ru_list = $rs->FetchRow()){                                     
                        ++$no;
                        $ulist[] = array(
                                          'no'=>$no,
                                          'posNIK'=>$ru_list['nip'],
                                                                                                                  'posNama'=>$ru_list['nama'],
                                                                                                                  'posAlamat'=>$ru_list['alamat'],
                                                                                                                  'posTelp'=>$ru_list['telpon'],
                                                                                                                  'posEmail'=>$ru_list['email'],
                                                                                                            'posgaji'=>number_format($ru_list['gaji'],0)
                                          );
                  }
              }
              $this->assign("pos", $ulist);
                              $this->display("employee.html");
      }
     
      function showtambahemp()
      {
        $this -> buatCombojabatan();
        $this->display("employee_add.html");
      }
     
      function buatCombojabatan($selected = '')
                  {
                              global $db;
                              $sqlBidang     = "SELECT * FROM tab_jabatan order by nama_jabatan";
                              $rsw = $db->Execute($sqlBidang);
              if (!$rsw->RecordCount())
              {
                   $kosong = 'kosong';
                   $jabatan_id[] = $kosong;
                   $jabatan_list[] = $kosong;
              }
              else
              {

                  while ($row = $rsw->FetchRow()){

                  $selected_opt = '';
                  if ($row['id_jbt'] == $selected)
                  {
                  $selected_opt = 'selected=selected';
                  }
                  $jabatan[] = array('id' => $row['id'],                                                                      'selected'      => $selected_opt,
                                                                                                                              'nama' => $row['nama_jabatan']);
                                         
                  }
              }
                  $this->assign("jabatan_opt", $jabatan);
                  }
     
     
}

?>
  1. Langkah berikutnya adalah membuat form entry dengan nama employee_add.html sbb:
{*debug*}
{include file="header.html"}
<html>
<head>
{literal}
<script type="text/javascript" src="tabber.js"></script>
<link rel="stylesheet" href="example.css" TYPE="text/css" MEDIA="screen">
<link rel="stylesheet" href="example-print.css" TYPE="text/css" MEDIA="print">

<script language=JavaScript>
/**
version 1.5
December 4, 2005
Julian Robichaux -- http://www.nsftools.com
*/

var datePickerDivID = "datepicker";
var iFrameDivID = "datepickeriframe";

var dayArrayShort = new Array('Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa');
var dayArrayMed = new Array('Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat');
var dayArrayLong = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');
var monthArrayShort = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec');
var monthArrayMed = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'June', 'July', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec');
var monthArrayLong = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');

// these variables define the date formatting we're expecting and outputting.
// If you want to use a different format by default, change the defaultDateSeparator
// and defaultDateFormat variables either here or on your HTML page.
var defaultDateSeparator = "/";        // common values would be "/" or "."
var defaultDateFormat = "dmy"    // valid values are "mdy", "dmy", and "ymd"
var dateSeparator = defaultDateSeparator;
var dateFormat = defaultDateFormat;


function displayDatePicker(dateFieldName, displayBelowThisObject, dtFormat, dtSep)
{
  var targetDateField = document.getElementsByName (dateFieldName).item(0);

  // if we weren't told what node to display the datepicker beneath, just display it
  // beneath the date field we're updating
  if (!displayBelowThisObject)
    displayBelowThisObject = targetDateField;

  // if a date separator character was given, update the dateSeparator variable
  if (dtSep)
    dateSeparator = dtSep;
  else
    dateSeparator = defaultDateSeparator;

  // if a date format was given, update the dateFormat variable
  if (dtFormat)
    dateFormat = dtFormat;
  else
    dateFormat = defaultDateFormat;

  var x = displayBelowThisObject.offsetLeft;
  var y = displayBelowThisObject.offsetTop + displayBelowThisObject.offsetHeight ;

  // deal with elements inside tables and such
  var parent = displayBelowThisObject;
  while (parent.offsetParent) {
    parent = parent.offsetParent;
    x += parent.offsetLeft;
    y += parent.offsetTop ;
  }

  drawDatePicker(targetDateField, x, y);
}

function drawDatePicker(targetDateField, x, y)
{
  var dt = getFieldDate(targetDateField.value );

  // the datepicker table will be drawn inside of a <div> with an ID defined by the
  // global datePickerDivID variable. If such a div doesn't yet exist on the HTML
  // document we're working with, add one.
  if (!document.getElementById(datePickerDivID)) {
    // don't use innerHTML to update the body, because it can cause global variables
    // that are currently pointing to objects on the page to have bad references
    //document.body.innerHTML += "<div id='" + datePickerDivID + "' class='dpDiv'></div>";
    var newNode = document.createElement("div");
    newNode.setAttribute("id", datePickerDivID);
    newNode.setAttribute("class", "dpDiv");
    newNode.setAttribute("style", "visibility: hidden;");
    document.body.appendChild(newNode);
  }

  // move the datepicker div to the proper x,y coordinate and toggle the visiblity
  var pickerDiv = document.getElementById(datePickerDivID);
  pickerDiv.style.position = "absolute";
  pickerDiv.style.left = x + "px";
  pickerDiv.style.top = y + "px";
  pickerDiv.style.visibility = (pickerDiv.style.visibility == "visible" ? "hidden" : "visible");
  pickerDiv.style.display = (pickerDiv.style.display == "block" ? "none" : "block");
  pickerDiv.style.zIndex = 10000;

  // draw the datepicker table
  refreshDatePicker(targetDateField.name, dt.getFullYear(), dt.getMonth(), dt.getDate());
}


/**
This is the function that actually draws the datepicker calendar.
*/
function refreshDatePicker(dateFieldName, year, month, day)
{
  // if no arguments are passed, use today's date; otherwise, month and year
  // are required (if a day is passed, it will be highlighted later)
  var thisDay = new Date();

  if ((month >= 0) && (year > 0)) {
    thisDay = new Date(year, month, 1);
  } else {
    day = thisDay.getDate();
    thisDay.setDate(1);
  }

  // the calendar will be drawn as a table
  // you can customize the table elements with a global CSS style sheet,
  // or by hardcoding style and formatting elements below
  var crlf = "\r\n";
  var TABLE = "<table cols=7 class='dpTable'>" + crlf;
  var xTABLE = "</table>" + crlf;
  var TR = "<tr class='dpTR'>";
  var TR_title = "<tr class='dpTitleTR'>";
  var TR_days = "<tr class='dpDayTR'>";
  var TR_todaybutton = "<tr class='dpTodayButtonTR'>";
  var xTR = "</tr>" + crlf;
  var TD = "<td class='dpTD' onMouseOut='this.className=\"dpTD\";' onMouseOver=' this.className=\"dpTDHover\";' ";    // leave this tag open, because we'll be adding an onClick event
  var TD_title = "<td colspan=5 class='dpTitleTD'>";
  var TD_buttons = "<td class='dpButtonTD'>";
  var TD_todaybutton = "<td colspan=7 class='dpTodayButtonTD'>";
  var TD_days = "<td class='dpDayTD'>";
  var TD_selected = "<td class='dpDayHighlightTD' onMouseOut='this.className=\"dpDayHighlightTD\";' onMouseOver='this.className=\"dpTDHover\";' ";    // leave this tag open, because we'll be adding an onClick event
  var xTD = "</td>" + crlf;
  var DIV_title = "<div class='dpTitleText'>";
  var DIV_selected = "<div class='dpDayHighlight'>";
  var xDIV = "</div>";

  // start generating the code for the calendar table
  var html = TABLE;

  // this is the title bar, which displays the month and the buttons to
  // go back to a previous month or forward to the next month
  html += TR_title;
  html += TD_buttons + getButtonCode(dateFieldName, thisDay, -1, "&lt;") + xTD;
  html += TD_title + DIV_title + monthArrayLong[ thisDay.getMonth()] + " " + thisDay.getFullYear() + xDIV + xTD;
  html += TD_buttons + getButtonCode(dateFieldName, thisDay, 1, "&gt;") + xTD;
  html += xTR;

  // this is the row that indicates which day of the week we're on
  html += TR_days;
  for(i = 0; i < dayArrayShort.length; i++)
    html += TD_days + dayArrayShort[i] + xTD;
  html += xTR;

  // now we'll start populating the table with days of the month
  html += TR;

  // first, the leading blanks
  for (i = 0; i < thisDay.getDay(); i++)
    html += TD + "&nbsp;" + xTD;

  // now, the days of the month
  do {
    dayNum = thisDay.getDate();
    TD_onclick = " onclick=\"updateDateField('" + dateFieldName + "', '" + getDateString(thisDay) + "');\">";
   
    if (dayNum == day)
      html += TD_selected + TD_onclick + DIV_selected + dayNum + xDIV + xTD;
    else
      html += TD + TD_onclick + dayNum + xTD;
   
    // if this is a Saturday, start a new row
    if (thisDay.getDay() == 6)
      html += xTR + TR;
   
    // increment the day
    thisDay.setDate(thisDay.getDate() + 1);
  } while (thisDay.getDate() > 1)

  // fill in any trailing blanks
  if (thisDay.getDay() > 0) {
    for (i = 6; i > thisDay.getDay(); i--)
      html += TD + "&nbsp;" + xTD;
  }
  html += xTR;

  // add a button to allow the user to easily return to today, or close the calendar
  var today = new Date();
  var todayString = "Today is " + dayArrayMed[today.getDay()] + ", " + monthArrayMed[ today.getMonth()] + " " + today.getDate();
  html += TR_todaybutton + TD_todaybutton;
  html += "<button class='dpTodayButton' onClick='refreshDatePicker(\"" + dateFieldName + "\");'>this month</button> ";
  html += "<button class='dpTodayButton' onClick='updateDateField(\"" + dateFieldName + "\");'>close</button>";
  html += xTD + xTR;

  // and finally, close the table
  html += xTABLE;

  document.getElementById(datePickerDivID).innerHTML = html;
  // add an "iFrame shim" to allow the datepicker to display above selection lists
  adjustiFrame();
}


/**
Convenience function for writing the code for the buttons that bring us back or forward
a month.
*/
function getButtonCode(dateFieldName, dateVal, adjust, label)
{
  var newMonth = (dateVal.getMonth () + adjust) % 12;
  var newYear = dateVal.getFullYear() + parseInt((dateVal.getMonth() + adjust) / 12);
  if (newMonth < 0) {
    newMonth += 12;
    newYear += -1;
  }

  return "<button class='dpButton' onClick='refreshDatePicker(\"" + dateFieldName + "\", " + newYear + ", " + newMonth + ");'>" + label + "</button>";
}


/**
Convert a JavaScript Date object to a string, based on the dateFormat and dateSeparator
variables at the beginning of this script library.
*/
function getDateString(dateVal)
{
  var dayString = "00" + dateVal.getDate();
  var monthString = "00" + (dateVal.getMonth()+1);
  dayString = dayString.substring(dayString.length - 2);
  monthString = monthString.substring(monthString.length - 2);

  switch (dateFormat) {
    case "dmy" :
      return dayString + dateSeparator + monthString + dateSeparator + dateVal.getFullYear();
    case "ymd" :
      return dateVal.getFullYear() + dateSeparator + monthString + dateSeparator + dayString;
    case "mdy" :
    default :
      return monthString + dateSeparator + dayString + dateSeparator + dateVal.getFullYear();
  }
}


/**
Convert a string to a JavaScript Date object.
*/
function getFieldDate(dateString)
{
  var dateVal;
  var dArray;
  var d, m, y;

  try {
    dArray = splitDateString(dateString);
    if (dArray) {
      switch (dateFormat) {
        case "dmy" :
          d = parseInt(dArray[0], 10);
          m = parseInt(dArray[1], 10) - 1;
          y = parseInt(dArray[2], 10);
          break;
        case "ymd" :
          d = parseInt(dArray[2], 10);
          m = parseInt(dArray[1], 10) - 1;
          y = parseInt(dArray[0], 10);
          break;
        case "mdy" :
        default :
          d = parseInt(dArray[1], 10);
          m = parseInt(dArray[0], 10) - 1;
          y = parseInt(dArray[2], 10);
          break;
      }
      dateVal = new Date(y, m, d);
    } else if (dateString) {
      dateVal = new Date(dateString);
    } else {
      dateVal = new Date();
    }
  } catch(e) {
    dateVal = new Date();
  }

  return dateVal;
}


/**
Try to split a date string into an array of elements, using common date separators.
If the date is split, an array is returned; otherwise, we just return false.
*/
function splitDateString(dateString)
{
  var dArray;
  if (dateString.indexOf("/") >= 0)
    dArray = dateString.split("/");
  else if (dateString.indexOf(".") >= 0)
    dArray = dateString.split(".");
  else if (dateString.indexOf("-") >= 0)
    dArray = dateString.split("-");
  else if (dateString.indexOf("\\") >= 0)
    dArray = dateString.split("\\");
  else
    dArray = false;

  return dArray;
}


function updateDateField(dateFieldName, dateString)
{
  var targetDateField = document.getElementsByName (dateFieldName).item(0);
  if (dateString)
    targetDateField.value = dateString;

  var pickerDiv = document.getElementById(datePickerDivID);
  pickerDiv.style.visibility = "hidden";
  pickerDiv.style.display = "none";

  adjustiFrame();
  targetDateField.focus();

  // after the datepicker has closed, optionally run a user-defined function called
  // datePickerClosed, passing the field that was just updated as a parameter
  // (note that this will only run if the user actually selected a date from the datepicker)
  if ((dateString) && (typeof(datePickerClosed) == "function"))
    datePickerClosed(targetDateField);
}

function adjustiFrame(pickerDiv, iFrameDiv)
{
  // we know that Opera doesn't like something about this, so if we
  // think we're using Opera, don't even try
  var is_opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
  if (is_opera)
    return;
 
  // put a try/catch block around the whole thing, just in case
  try {
    if (!document.getElementById(iFrameDivID)) {
      // don't use innerHTML to update the body, because it can cause global variables
      // that are currently pointing to objects on the page to have bad references
      //document.body.innerHTML += "<iframe id='" + iFrameDivID + "' src='javascript:false;' scrolling='no' frameborder='0'>";
      var newNode = document.createElement("iFrame");
      newNode.setAttribute("id", iFrameDivID);
      newNode.setAttribute("src", "javascript:false;");
      newNode.setAttribute("scrolling", "no");
      newNode.setAttribute ("frameborder", "0");
      document.body.appendChild(newNode);
    }
   
    if (!pickerDiv)
      pickerDiv = document.getElementById(datePickerDivID);
    if (!iFrameDiv)
      iFrameDiv = document.getElementById(iFrameDivID);
   
    try {
      iFrameDiv.style.position = "absolute";
      iFrameDiv.style.width = pickerDiv.offsetWidth;
      iFrameDiv.style.height = pickerDiv.offsetHeight ;
      iFrameDiv.style.top = pickerDiv.style.top;
      iFrameDiv.style.left = pickerDiv.style.left;
      iFrameDiv.style.zIndex = pickerDiv.style.zIndex - 1;
      iFrameDiv.style.visibility = pickerDiv.style.visibility ;
      iFrameDiv.style.display = pickerDiv.style.display;
    } catch(e) {
    }

  } catch (ee) {
  }

}

    function validasiForm()
    {
        formObj = document.employee_form;
        if (formObj.name.value == "")
        {
            alert("Anda tidak mengisi field nama.");
            formObj.name.focus();
            return false;
        }
        else if (formObj.bidang.value == "")
        {
            alert("Anda tidak mengisi field Dealer/AHASS");
            formObj.bidang.focus();
            return false;
        }
        else if (formObj.jabatan.value == "")
        {
            alert("Anda tidak mengisi Jabatan");
            formObj.jabatan.focus();
            return false;
        }
      else if (formObj.pendidikan.value == "")
        {
            alert("Anda tidak mengisi field pendidikan.");
            formObj.pendidikan.focus();
            return false;
        }
        else if (formObj.tlahir.value == "")
        {
            alert("Anda tidak mengisi field Tempat Lahir.");
            formObj.tlahir.focus();
            return false;
        }
        else if (formObj.born_date.value == "")
        {
            alert("Anda tidak mengisi field tanggal lahir.");
            formObj.born_date.focus();
            return false;
        }
        else if (formObj.accepted_date.value == "")
        {
            alert("Anda tidak mengisi field tanggal Masuk.");
            formObj.accepted_date.focus();
            return false;
        }
        else if (formObj.kabkota.value == "")
        {
            alert("Anda tidak mengisi field Kabupatan atau Kota Karyawan.");
            formObj.kabkota.focus();
            return false;
        }
        else if (formObj.permanen_date.value == "")
        {
          if      (formObj.status.value == "1")
          {
            alert("Anda tidak mengisi field tgl. permanen untuk karyawan permanen");
            formObj.permanen_date.focus();
            return false;
          }      
        }
        else if (formObj.endtemp_date.value == "")
        {
          if      (formObj.status.value == "0")
          {
            alert("Anda tidak mengisi field tgl. berakhir kontrak untuk karyawan temporary");
            formObj.endtemp_date.focus();
            return false;
          }      
        }
    }

</script>

<style>
body {
      font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
      font-size: .8em;
      }

/* the div that holds the date picker calendar */
.dpDiv {
      }


/* the table (within the div) that holds the date picker calendar */
.dpTable {
      font-family: Tahoma, Arial, Helvetica, sans-serif;
      font-size: 12px;
      text-align: center;
      color: #505050;
      background-color: #ece9d8;
      border: 1px solid #AAAAAA;
      }


/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
      }


/* the top table row that holds the month, year, and forward/backward buttons */
.dpTitleTR {
      }


/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTR {
      }


/* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTodayButtonTR {
      }


/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
      border: 1px solid #ece9d8;
      }


/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlightTD {
      background-color: #CCCCCC;
      border: 1px solid #AAAAAA;
      }


/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */
.dpTDHover {
      background-color: #aca998;
      border: 1px solid #888888;
      cursor: pointer;
      color: red;
      }


/* the table cell that holds the name of the month and the year */
.dpTitleTD {
      }


/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD {
      }


/* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButtonTD {
      }


/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTD {
      background-color: #CCCCCC;
      border: 1px solid #AAAAAA;
      color: white;
      }


/* additional style information for the text that indicates the month and year */
.dpTitleText {
      font-size: 12px;
      color: gray;
      font-weight: bold;
      }


/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlight {
      color: 4060ff;
      font-weight: bold;
      }


/* the forward/backward buttons at the top */
.dpButton {
      font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
      font-size: 10px;
      color: gray;
      background: #d8e8ff;
      font-weight: bold;
      padding: 0px;
      }


/* the "This Month" and "Close" buttons at the bottom */
.dpTodayButton {
      font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
      font-size: 10px;
      color: gray;
      background: #d8e8ff;
      font-weight: bold;
      }

</style>
{/literal}
</head>

<body>
<p>
<FORM method=post action=employee.php?mod=saveEmployee name=employee_form enctype="multipart/form-data">
<!--onSubmit="return validasiForm()"-->
<INPUT TYPE=hidden NAME=id VALUE={$id}>
<TABLE CELLPADDING=1 WIDTH=100%>
<TR><TD VALIGN=TOP width="50%">
<FONT SIZE=4>DATA KARYAWAN </FONT>
<TD align=right>
                                                                  {if $authenticated == 1}
                                                                    <input type=submit value=Save class=Button1>
                                                                    <input type=reset value=Reset class=Button1>
                                                                  {/if}
                                                                    <input type=button value="Back" onClick="javascript:history.go(-1)" class=Button1>
                                                                  </TD>
</TR>
<TR><TD VALIGN=TOP>
<!--this is setup up column width  -->
<TABLE CELLSPACING=1 CELLPADDING=1 WIDTH=100%>
                     <TR >
                        <TD>NIK</TD>
                        <TD VALIGN=MIDDLE><b>:</b></TD>
                                                                 
                        <TD>
                                                                  <INPUT TYPE=TEXT NAME=nik size=20 value="{$nik}">
                                                                  <label style="color:#F00;font-size:18px">*</label>
                                                                  <label style="color:#F00;font-size:12px;font-style:italic">{$statusNik}</label></TD>
                    </TR>
                                                      <TR>

                    </TR>
                    <TR>
                        <TD width="100">Nama Lengkap</TD>
                        <TD VALIGN=MIDDLE><b>:</b></TD>
                        <TD><INPUT NAME=name size=50 maxlenght=100 value="{$name}">
                                                                  <label style="color:#F00;font-size:18px">*</label>
                                                                  <label style="color:#F00;font-size:12px;font-style:italic">{$statusName}</label>
                                                                  </TD>
                    </TR>
                                                                                                                  <TR >
                        <TD>Jabatan</TD>
                        <TD VALIGN=MIDDLE><b>:</b></TD>
                        <TD>
                                                                  <select name=jabatan>
                                                                  <option value=''>Pilih</option>
                                                                  {section name=detail loop=$jabatan_opt}
                                                                              <option value="{$jabatan_opt[detail].id}" {$jabatan_opt[detail].selected}>{$jabatan_opt[detail].nama}</option>
                                                                  {/section}
                                                                  </select>
                                                                  <label style="color:#F00;font-size:18px">*</label>
                                                                  <label style="color:#F00;font-size:12px;font-style:italic">{$statusJabatan}</label>
                                                                  </TD>
</TR>
                    <TR >
                        <TD>Tanggal Lahir</TD>
                        <TD VALIGN=MIDDLE><b>:</b></TD>

                        <TD>
                                          <INPUT TYPE=TEXT NAME=born_date size=10 value="{$born_date}">
                                          <input type=button value="select" onclick="displayDatePicker('born_date');">
dd/mm/yyyy
                                         
                        </TD>
                    </TR>
                                                                             
                                                      <TR >
                        <TD VALIGN=TOP>Alamat Tetap</TD>
                        <TD VALIGN=TOP><b>:</b></TD>
                        <TD>
                        <TEXTAREA NAME=address cols=30 rows=3>{$address}</TEXTAREA>
                        <script language="JavaScript1.2" defer>editor_generate('address');</script>
                        </TD>
                    </TR>          
                                                      <TR >
                        <TD>Telpon Kantor</TD>
                        <TD VALIGN=MIDDLE><b>:</b></TD>
                        <TD><INPUT TYPE=TEXT NAME=telpon_kantor size=20 value="{$telpon_kantor}"></TD>
                    </TR>
                                          <TR >
                        <TD colspan=2>&nbsp;</TD>
                        <TD>
                          <input type=submit value="SAVE">
                                                    <input type=button value="Back" onClick="javascript:history.go(-1)" class=Button1>                        </TD>
                    </TR>          
    </TABLE>
    </TD>
</FORM>
</body>
</html>
{include file="footer.html"}

  1. Setelah membuat form entry employee_add.html yang kita letakan pada folder templates langkah selanjutnya adalah membuat fungsi untuk menyimpan data dengan perintah SQLnya adalah INSERT INTO, edit file employee.php sehingga program dapat anda lihat sbb:

<?php
require_once "clsemployee.php";

$mPage = new MainPage();

$mod = $_REQUEST['mod'];

switch ($mod) {
  case 'saveEmployee':
  $mPage -> savetambahemp();
  break;


  case 'addPos':
  $mPage -> showtambahemp();
  break;
 
  default :
                $mPage -> showlistemployee(); 
      break;
}
?>



  1. edit file clsemployee.php tambahkan fungsi savetambahemp() sbb:
function savetambahemp()
            {
                        global $db;
                        $nik = $_POST['nik'];
                        $name = $_POST['name'];
                        $jabatan = $_POST['jabatan'];
                        $born_date = $_POST['born_date'];
                        $address = $_POST['address'];
                        $telpon_kantor = $_POST['telpon_kantor'];
                       
                        $sql_employee = "INSERT INTO `dat_personil` ( nip, nama, alamat, tgl_lahir, telpon, id_jabatan )
                                                                        VALUES
                                                                        ('$nik', '$name',  '$address' , STR_TO_DATE('$born_date', '%d/%m/%Y'), '$telpon_kantor', '$jabatan')";                
                        //echo $sql_employee;echo exit;                                           
                                    $result_employee = $db->Execute($sql_employee);
                                                                       
                    if($result_employee)
                    {
                        echo "<script language=javascript>
                                alert('Terima Kasih, berhasil memperbaiki data');
                                window.location='employee.php';
                             </script>";

                    }
                    else{
                        echo "<script language=javascript>
                                alert('Gagal menyimpan data');
                                window.location='employee.php';
                             </script>";
                                   
                                    }
            }
  1. Setelah membuat tiga fungsi baru dan membuat file employee_add.html, langkah selanjutnya menguji coba program tersebut melalui browser

SELAMAT MENCOBA

Share : PHP (menambahkan data melalui form entry html)

Related Posts

PHP (menambahkan data melalui form entry html)
4/ 5
Oleh