I was testing a website's security and in an attempt to exploit its XSS, I used <script> tag. However, this website has a word limit on the input, so my ending script tag was not inserted in the database. Now when I open the webpage the submit button no longer appear because it was inside the truncated script tag. Due to Chrome's auto-correction, that specific script tag gets closed after submit button tag. Are anyone able to help me out?
After auto-correction, the HTML code of the page looks like this.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Update Student Information</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="../login/css/style_reg.css" type="text/css" />
<link rel="stylesheet" href="../login/js/jquery-smoothness-ui.css">
<script src="../login/js/jquery-2.0.3.js"></script>
<script src="../login/js/jquery-ui.js"></script>
<script type="text/javascript">
window.onload=function()
{
var c=document.getElementById("same_info");
c.onchange=toggle_shipping_visibility;
}
function toggle_shipping_visibility()
{
var c=document.getElementById("same_info");
var t=document.getElementById("shipping_table");
t.style.display=(c.checked) ? 'none' : '';
}
</script>
<script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>
</head>
<body>
<div class="wrapper">
<form class="form2" action="sem-reg.php" method="POST">
<div class="formtitle">Update Student Information</div>
<div class="note">
»» All Fields are Compulsory
<h3 style="margin-left:20px;color:green;">Welcome ADARSH I can still edit it</h3>
<h3 style="margin-left:20px;color:green;">1403097</h3>
</div>
<div class="input">
<div class="inputtext">University Roll:</div>
<div class="inputcontent">
<input type="text" name="univ" placeholder="University Roll No" value="1403097"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">College Roll:</div>
<div class="inputcontent">
<input type="text" name="coll" placeholder="College Roll No" value="1006/14"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">Name:</div>
<div class="inputcontent">
<input type="text" name="name" placeholder="Name" value="ADARSH I can still edit it"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">Father's Name:</div>
<div class="inputcontent">
<input type="text" name="father" placeholder="Father's Name" value="PAWAN KUMAR" readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">Mother's Name:</div>
<div class="inputcontent">
<input type="text" name="mother" placeholder="Mother's Name" value="SH. MT. BABLI DEVI"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">Batch</div>
<div class="inputcontent" readonly>
<select name="batch" >
<option disabled="disabled" value="2011">2011</option>
<option value="2011">2011</option><option value="2012">2012</option><option value="2013">2013</option><option value="2014">2014</option><option value="2015">2015</option> </select>
</div>
</div>
<div class="input">
<div class="inputtext">Semester</div>
<div class="inputcontent">
<select name="sem" >
<option value="4">4</option>
<option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option> </select>
</div>
</div>
<div class="input">
<div class="inputtext">Branch</div>
<div class="inputcontent" >
<select name="bra">
<option value="3">B.Tech - Computer Science Engineering</option>
<option value="1">B.Tech - Biotechnology Engineering</option><option value="2">B.Tech - Chemical Engineering</option><option value="3">B.Tech - Computer Science Engineering</option><option value="4">B.Tech - Electronics & Communications Engineering</option><option value="5">B.Tech - Information Technology</option><option value="6">B.Tech - Mechanical Engineering</option><option value="10">M.Tech Part Time Thermal Engineering</option><option value="11">M.Tech Part Time Computer Science Engineering</option><option value="12">M.Tech Part Time Electronics & Communications Engineering</option><option value="13">M.Tech Part Time Chemical Engineering</option><option value="14">M.Tech Part Time Production Engineering</option><option value="15">M.Sc Physics</option> </select>
</div>
</div>
<div class="input">
<div class="inputtext">Practical Group</div>
<div class="inputcontent">
<select name="prac">
<option value="2">B1</option>
<option value="1">None</option><option value="2">B1</option><option value="3">B2</option><option value="4">B3</option> </select>
</div>
</div>
<div class="input">
<div class="inputtext">D.O.B</div>
<div class="inputcontent">
<input id="datepicker" type="text" name="dob" placeholder="D.O.B." value="24/04/1997"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">Section</div>
<div class="inputcontent">
<select name="sec">
<option value="1">A</option>
<option value="0">None</option>
<option value="1">A</option>
<option value="2">B</option>
</select>
</div>
</div>
<div class="input">
<div class="inputtext">Category</div>
<div class="inputcontent">
<select name="cat" readonly>
<option value="General">General</option>
<option value="General">General</option><option value="Scheduled Castes/ Scheduled Tribes">Scheduled Castes/ Scheduled Tribes</option><option value="Backward Classes">Backward Classes</option><option value="Border Areas">Border Areas</option><option value="Backward Areas">Backward Areas</option><option value="Sports Persons">Sports Persons</option><option value="Children/ Grand Children of Freedom Fighters/Political Sufferers">Children/ Grand Children of Freedom Fighters/Political Sufferers</option><option value="Disabled Persons">Disabled Persons</option><option value="Children/Widow Of Defence Personnel/ Ex-Servicemen etc">Children/Widow Of Defence Personnel/ Ex-Servicemen etc</option><option value="Children/ Widows Of Para-military forces/Punjab Police, PAP and Punjab Home Guards">Children/ Widows Of Para-military forces/Punjab Police, PAP and Punjab Home Guards</option><option value="Riot Affected/ Terrorist affected families">Riot Affected/ Terrorist affected families</option><option value="Tsunami victims">Tsunami victims</option> </select>
</div>
</div>
<div class="input">
<div class="inputtext">Phone No(Parents):</div>
<div class="inputcontent">
<input type="text" name="phone_parent" placeholder="Phone no(Parents)" value="+919459578556"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">Phone No(Self): </div>
<div class="inputcontent">
<input type="text" name="phone_self" placeholder="Phone No(Self)" value="+919814615325"readonly/>
</div>
</div>
<div class="add">Permanent Address:</div>
<div class="input" style="height:120px">
<div class="inputtext">Address: </div>
<div class="inputcontent">
<textarea class="textarea" name="address" placeholder="Address" ></textarea><script>alert(hahahahahahahahhaha you gonna pay for this bu</textarea>
</div>
</div>
<div class="input">
<div class="inputtext">City: </div>
<div class="inputcontent">
<input type="text" name="city" placeholder="City" value="Dhar"readonly/>
</div>
</div>
<div class="input">
<div class="inputtext">State: </div>
<div class="inputcontent">
<input type="text" name="state" placeholder="State" value="Himachal"readonly/>
</div>
</div>
<input type="checkbox" name="same_info" id="same_info" checked="checked">Correspondence Address is same as Permanent Address<br>
<table id="shipping_table" style="display:none">
<tr class="inputtext">
<td>Address</td>
</tr>
<tr>
<td><textarea class="textarea" name="c_address"placeholder="Address"></textarea><script>alert(hahahahahahahahhaha you gonna pay for this bu</textarea></td>
</tr>
<tr class="inputtext">
<td>City</td>
</tr>
<tr>
<td class="inputcontent"><input type="text" name="c_city" placeholder="City" value="Dhar"></td>
</tr>
<tr class="inputtext">
<td>State</td>
</tr>
<tr>
<td class="inputcontent"><input type="text" name="c_state" placeholder="State" value="Himachal"></td>
</tr>
</table>
<div class="buttons">
«« Go Back To Home Page
<input class="orangebutton" type="submit" name="submit" value="Update" />
</div>
</form>
</div>
</body>
</html>
Using Chrome you can right-click on the last visible element, or somewhere else on the page, select Inspect and then edit the HTML that is loaded in the browser using the Chrome built in developer tools. E.g. remove/alter the <script> tag. And see if the page becomes usable again.
You can also try a recent version of Firefox or MSIE, they have features very similar to the above.
Related
I have this code where it works is to know how many people are booked for the day that I enter in the form.
The query works well and returns the expected result.
The problem is that I would like to show this result next to an hour of the select, so it doesn't show me.
If the div of the id result-date or pull out of the select of the different time options I see the result.
What could I do to see the result of the query within an option?
This is the file of check_availablity.php.
require('config.php');
sleep(1);
$data = $_POST['data'];
$result = $connexion->query(
'SELECT persones FROM reservas where data = \''.$data.'\' ORDER by hora ASC'
);
if ($result->num_rows > 0) {
foreach ($result as $hores){
echo $hores['persones'].' llocs disponibles.';
}
}
else{
echo 'Esta tot reservat';
}
<!DOCTYPE HTML>
<html>
<head>
<title>Rem la Ràpita</title>
<link rel="icon" type="image/png" href="../images/favicon.png" sizes="32x32"/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--Comprovar la disponibilitat d'horari-->
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#data').on('blur', function(){
var data = $(this).val();
var dataString = 'data='+data;
$.ajax({
type: "POST",
url: "check_availablity.php",
data: dataString,
success: function(data) {
$('#result-data').fadeIn(1000).html(data);
}
});
});
});
</script>
</head>
<body>
<div class="container-login">
<div class="wrap-login" style="width: 1000px">
<!--<form class="login-form validate-form" action="bd/reservar.php" method="post">-->
<form class="login-form validate-form" action="bd/reservar.php" method="post">
<span class="login-form-title"></span>
<div class="row">
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate = "Nom incorrecte">
<input class="input100" type="text" id="nom" name="nom" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate = "Email incorrecto">
<input class="input100" type="text" id="apellidos" name="apellidos" placeholder="" >
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate = "Email incorrecto">
<input class="input100" type="text" id="email" name="email" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate="Telefon incorrecto">
<input class="input100" type="text" id="telefon" name="telefon" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate="Persones incorrecto">
<input class="input100" type="number" id="persones" name="persones" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate="Data incorrecto">
<input class="input100" type="date" id="data" name="data" placeholder="Fecha">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate="Hora incorrecto">
<select name="hora" id="hora" class="input100">
<option disabled selected></option>
<option value="12:00">12:00</option><div id="result-data"></div>
<option value="12:30">12:30</option>
<option value="13:00">13:00</option>
<option value="13:30">13:30</option>
<option value="14:00">14:00</option>
<option value="20:00">20:00</option>
<option value="20:30">20:30</option>
<option value="21:00">21:00</option>
<option value="21:30">21:30</option>
<option value="22:00">22:00</option>
<option value="22:30">22:30</option>
</select>
<span class="focus-efecto"></span>
</div>
<div class="container-login-form-btn">
<div class="wrap-login-form-btn">
<div class="login-form-bgbtn"></div>
<button type="submit" name="submit" class="login-form-btn">RESERVAR</button>
</div>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
It looks like you are trying to use ajax to change the selected option ? That will not work. And a div tag on the option will not work either.
The select is normally styled by the OS and it is not easy to change things in it. It makes no sense to use ajax to display something next to an option.
If your goal is to update the dropdown, before the user opens it, then use the ajax to replace the complete select element, including the options.
Below code give me the error:
facebook.htmlName=&LastName=&Email=&Password=&enterEmail=&country_name=&code=&mobile=&btn2=faceboo…:203 The specified value "+,91" is not a valid number. The value must match to the following regular expression: -?(\d+|\d+.\d+|.\d+)([eE][-+]?\d+)?
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>user registration form validation using javascript with example</title>
<script type="text/javascript">
function selectvalue(x){
var country_dropdown=document.getElementById("country");
var country_Mcode=document.getElementById("country_mcode");
if(document.getElementById("country").value=="1")
{
document.getElementById("country_mcode").value="+91"
}
if(document.getElementById("country").value=="2")
{
document.getElementById("country_mcode").value="+1"
}
if(document.getElementById("country").value=="3")
{
document.getElementById("country_mcode").value="+880"
}
if(document.getElementById("country").value=="4")
{
document.getElementById("country_mcode").value="+81"
}
if(document.getElementById("country").value=="5")
{
document.getElementById("country_mcode").value="+86"
}
}
</script>
</head>
<body>
<div id="emptyDiv">
</div>
<div id="description"></div>
<!--container start-->
<div id="container">
<div id="container_body">
<div>
<h2 class="form_title">User Registration Form Demo</h2>
<p class="head_para">Form Validated Using Javascript</p>
</div>
<!--Form start-->
<div id="form_name">
<div class="firstnameorlastname">
<form name="form" >
<div id="errorBox"></div>
<input type="text" name="Name" value="" placeholder="First Name" class="input_name" >
<input type="text" name="LastName" value="" placeholder="Last Name" class="input_name" >
</div>
<div id="email_form">
<input type="text" name="Email" value="" placeholder="Your Email" class="input_email">
</div>
<div id="password_form">
<input type="password" name="Password" value="" placeholder="New Password" class="input_password">
</div>
<div id="Re_email_form">
<input type="text" name="enterEmail" value="" placeholder="Re-enter Email" class="input_Re_email">
</div>
<!--birthday details start-->
<div>
<h3 class="country">Country</h3>
</div>
<div>
<select name="country_name" id="country" onchange="selectvalue()">
<option value="" selected >Country</option>
<option value="1">india</option>
<option value="2">america</option>
<option value="3">Bangladesh</option>
<option value="4">japan</option>
<option value="5">china</option>
</select>
</div>
<div>
<h3 class="country">Mobile No</h3>
</div>
<div>
<input type="number" name="code" value="" class="input_name" id="country_mcode" >
</div>
<div>
<input type="number" name="mobile" value="" placeholder="Mobile No" class="input_name" >
</div>
<!--birthday details ends-->
<div>
<p id="sign_user" onClick="Submit()">Registration</p>
</div>
<div>
<input type="submit" name="btn2" value="facebook registration"/>
</div>
<div>
<p id="google_user" onClick="Submit()">Google Registration</p>
</div>
</form>
</div>
<!--form ends-->
</div>
</div>
<!--container ends-->
</body>
</html>
That happens because your input field is type=number and a + (plus) can not be added this way.
That is actually a little odd, because you can type in +10 for example. But then it is interpreted as a positive 10 and the + is removed and not stored in the value attribute. You can either change the type or remove the plus from the number making it a valid number and not a string.
This should be verifiable if you type +10 in your field and then use the console and type in document.getElementById('country_mcode')[0].value.
The returned value should be 10 not +10.
Edit:
You could remove the type enforcement and add a pattern="\+\d{1,5}" or something similar to allow for your specific use case if the input field can be set by user.
I want to add the following div structure whenever the '+' button [the addMore() function] is clicked. Although i am able to add the div structure, but the alignment of the input text are not equal as compared to the hard coded.
html file:
<form class="align-center">
<p class="6u 12u$(medium)">
Start Date: <input type="date" name="startdate" id="startdate" />
End Date: <input type="date" name="enddate" id="enddate" />
</p>
<p>
<div class="6u$ 12u$(xsmall)"><input type="text" name="numParticipants" id="numParticipants" value="" placeholder="Number of Participants"/></div>
</p>
<p>
<div class="row">
<div class="3u 12u$(medium)">
<div class="select-wrapper">
<select>
<option value="">-Select Programme-</option>
<option value="1">Yogalates</option>
<option value="2">Pilates</option>
<option value="3">Kick Boxing</option>
<option value="4">K-Pop Dance</option>
<option value="5">Hip Hop</option>
<option value="6">Jazz Aerobics</option>
<option value="7">Zumba</option>
<option value="8">Fitball</option>
</select>
</div>
</div>
<div>OR</div>
<div class="3u 12u$(medium)">
<div class="12u$">
<input type="text" value="" placeholder="Customize your own programme" />
</div>
</div>
<div class="2u 12u$(medium)">
<div class="12u$">
<input type="text" value="" placeholder="Venue" />
</div>
</div>
</div>
</p>
<p>
<div class="row" id="newProg">
</div>
<div class="row">
<div class="2u 12u$(medium)">
<a class="button" onclick="addMore()"><div style="font-size: 35px">+</div></a>
<a class="button" style="margin:0 0 0 1em" onclick="removeProg()"><div style="font-size: 35px">-</div></a>
</div>
</div>
<div class="2u 12u$(medium); image right">
Submit
</div>
</p>
</form>
main.js
var counter = 0;
function addMore() {
counter++;
var objNewDiv = document.createElement('div');
objNewDiv.setAttribute('id', 'addProg' + counter);
objNewDiv.setAttribute('class', 'row');
objNewDiv.innerHTML = '<div class="5u 12u$(medium)"> <div class="select-wrapper"> <select> <option value="">-Select Programme-</option> <option value="1">Yogalates</option> <option value="2">Pilates</option> <option value="3">Kick Boxing</option> <option value="4">K-Pop Dance</option> <option value="5">Hip Hop</option> <option value="6">Jazz Aerobics</option> <option value="7">Zumba</option> <option value="8">Fitball</option> </select> </div> </div> <div>OR</div> <div class="5u 12u$(medium)"> <input type="text" value="" placeholder="Customize your own programme"/> </div> <div class="3u$ 12u$(medium)"> <input type="text" value="" placeholder="Venue" /> </div> ';
document.getElementById('newProg').appendChild(objNewDiv);
}
Result when page is loaded:
when page loaded
Actual and Expected result:
actual and expected outcome
You have differenc in the class names of the div tags which you are appending in jquery.
Make it same as the Static HTML content, And the expected result will be achieved.
Differences I see is as below.
Static HTML has - <div class="3u 12u$(medium)"> ,Your Jquery HTML has - <div class="5u 12u$(medium)">
Static HTML has - <div class="3u 12u$(medium)">, Your jquery HTML has - <div class="5u 12u$(medium)">
Static HTml has - <div class="2u$ 12u$(medium)">, Your Jquery HTML has <div class="3u$ 12u$(medium)">
Because of the differences in the class names you find the differences in the way its rendered in the UI.
You missed one of your divs in JavaScript inner HTML string. I think it should be like this:
objNewDiv.innerHTML = '<div class="5u 12u$(medium)"> <div class="select-wrapper"> <select> <option value="">-Select Programme-</option> <option value="1">Yogalates</option> <option value="2">Pilates</option> <option value="3">Kick Boxing</option> <option value="4">K-Pop Dance</option> <option value="5">Hip Hop</option> <option value="6">Jazz Aerobics</option> <option value="7">Zumba</option> <option value="8">Fitball</option> </select> </div> </div> <div>OR</div> <div class="5u 12u$(medium)"> <div class="12u$"> <input type="text" value="" placeholder="Customize your own programme"/> </div> </div> <div class="3u$ 12u$(medium)"> <div class="12u$"> <input type="text" value="" placeholder="Venue" /> </div> </div> ';
I'd like to add a datepicker to my code to pick the birth date of user, however, even though I have embed the jquery and jquery-ui, the datepicker is not functioning and showed up...
Here is my code (I am using laravel 5.2)
here is the layout:
<!--
Retrospect by TEMPLATED
templated.co #templatedco
Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)-->
<head>
<title>#yield('title')</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="{{asset('assets/css/index.css')}}" />
<script src="{{asset('jquery-ui/external/jquery/jquery.js')}}"></script>
<link rel="stylesheet" href="{{asset('jquery-ui/jquery-ui.css')}}">
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
<!-- Header -->
<header id="header" class="skel-layers-fixed">
<h1>#yield('header')</h1>
Menu
</header>
<!-- Nav -->
<nav id="nav">
<!-- Authentication Links -->
#if (Auth::guard('web')->guest())
<ul class="links">
<li>Home</li>
<li>assessment</li>
<!-- <li>Kirim Email</li> -->
</ul>
#else
<ul class="links">
<li>Home</li>
<li>assessment</li>
<li>Edit Account</li>
<li>Edit Pasien</li>
<li>Logout</li>
<!-- <li>Kirim Email</li> -->
</ul>
#endif
</nav>
#yield('content')
<!-- Footer -->
<footer id="footer">
<div class="inner">
<ul class="icons">
<li><a href="#" class="icon fa-facebook">
<span class="label">Facebook</span>
</a></li>
<li><a href="#" class="icon fa-twitter">
<span class="label">Twitter</span>
</a></li>
<li><a href="#" class="icon fa-instagram">
<span class="label">Instagram</span>
</a></li>
<li><a href="#" class="icon fa-linkedin">
<span class="label">LinkedIn</span>
</a></li>
</ul>
<p>
FAQ | Terms & Conditions
</p>
<ul class="copyright">
<li>© PT. Digital Media Laboratorindo.</li>
<li>Images: Unsplash.</li>
<li>Design: TEMPLATED.</li>
</ul>
</div>
</footer>
<!-- Scripts -->
<script src="{{asset('assets/js/skel.min.js')}}"></script>
<script src="{{asset('assets/js/util.js')}}"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="{{asset('assets/js/index.js')}}"></script>
and here is my own form...
#extends('master.nonindex')
#section('title')
Halaman Edit Pasien
#endsection
#section('header')
Edit Pasien
#endsection
#section('content')
<script src="{{asset('jquery-ui/jquery-ui.min.js')}}"></script>
<script type="text/javascript">
$(".datepicker1").datepicker({
//home service
dateFormat: 'yy-mm-dd',
altField: '.datepicker1',
altFormat: 'yy-mm-dd',
minDate: '+1d',
maxDate: '+14d'
});
</script>
<!-- Main -->
<section id="main" class="wrapper">
<div class="container">
<!-- Form -->
<section>
#foreach($pasien as $p)
<h3>Edit Pasien {{$p->nama_panggilan}}</h3>
<form method="post" action="{{URL::to('updatePasien')}}">
<input type="hidden" name="nama_panggilan" value="{{$p->nama_panggilan}}">
<div class="row uniform 50%">
<div class="6u 12u$(xsmall)">
Nama depan:
<input type="text" name="nama_depan" id="name" value="{{$p->nama_depan}}" placeholder="Nama Depan" />
</div>
<div class="6u$ 12u$(xsmall)">
Nama belakang:
<input type="text" name="nama_belakang" id="email" value="{{$p->nama_belakang}}" placeholder="Nama Belakang" />
</div>
<div class="12u$">
No. KTP:
<input type="text" name="ktp" value="{{$p->no_ktp}}" placeholder="Nomor KTP Anda">
</div>
<div class="12u$">
Alamat:
<input type="text" name="alamat" value="{{$p->alamat}}" placeholder="Tuliskan Alamat Anda">
</div>
<div class="12u$">
Tanggal lahir:
<input type="text" name="tanggal_lahir" value="{{$p->tanggal_lahir}}" placeholder="Tanggal Lahir" class="datepicker1">
</div>
<div class="12u$">
Agama: <br>
<select name="agama" id="category">
<option value="{{$p -> agama}}">{{$p -> agama}}</option>
<option value="Kristen Protestan">Kristen Protestan</option>
<option value="Kristen Katolik">Kristen Katolik</option>
<option value="Islam">Islam</option>
<option value="Konghucu">Konghucu</option>
<option value="Hindu">Hindu</option>
<option value="Budha">Budha</option>
</select>
</div>
<div class="12u$">
Jenis Kelamin: <br>
#if($p->jenis_kelamin=='L')
<select name="jenis_kelamin" id="category">
<option value="L" selected>Laki-laki</option>
<option value="P">Perempuan</option>
</select>
#elseif($p->jenis_kelamin=='P')
<select name="jenis_kelamin" id="category">
<option value="L">Laki-laki</option>
<option value="P" selected>Perempuan</option>
</select>
#else
<select name="jenis_kelamin" id="category">
<option value="" selected>Jenis Kelamin Anda</option>
<option value="L">Laki-laki</option>
<option value="P" >Perempuan</option>
</select>
#endif
</div>
<div class="6u 12u$(xsmall)">
TB:
<input type="text" name="tb" id="name" value="{{$p->tb}}" placeholder="TB Anda" />
</div>
<div class="6u$ 12u$(xsmall)">
BB:
<input type="text" name="bb" id="email" value="{{$p->bb}}" placeholder="BB Anda" />
</div>
<div class="12u$">
Golongan Darah: <br>
<select name="goldar" id="category">
<option value="{{$p -> gol_darah}}">{{$p -> gol_darah}}</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="AB">AB</option>
<option value="O">O</option>
</select>
</div>
<div class="12u$">
Status Perkawinan: <br>
<select name="status_perkawinan" id="category">
<option value="{{$p -> status_perkawinan}}">{{$p -> status_perkawinan}}</option>
<option value="1">Kawin</option>
<option value="2">Belum Kawin</option>
</select>
</div>
<div class="12u$">
Apakah anda mempunyai Alergi?
<input type="text" name="alergi" value="{{$p->alergi}}" placeholder="Apakah anda mempunyai Alergi">
</div>
<div class="12u$">
<ul class="actions">
<li><input type="submit" value="Update" class="special" /></li>
</ul>
</div>
</div>
</form>
#endforeach
</section>
</div>
</section>
#endsection
Thank you for your help...
UPDATE:
here is the code rayon
#extends('master.nonindex')
#section('title')
Halaman Edit Pasien
#endsection
#section('header')
Edit Pasien
#endsection
#section('content')
<script type="text/javascript">
$(document).ready(function(){
$(".datepicker1").datepicker({
//home service
dateFormat: 'yy-mm-dd',
altField: '.datepicker1',
altFormat: 'yy-mm-dd',
minDate: '+1d',
maxDate: '+14d'
});
});
</script>
<!-- Main -->
<section id="main" class="wrapper">
<div class="container">
<!-- Form -->
<section>
#foreach($pasien as $p)
<h3>Edit Pasien {{$p->nama_panggilan}}</h3>
<form method="post" action="{{URL::to('updatePasien')}}">
<input type="hidden" name="nama_panggilan" value="{{$p->nama_panggilan}}">
<div class="row uniform 50%">
<div class="6u 12u$(xsmall)">
Nama depan:
<input type="text" name="nama_depan" id="name" value="{{$p->nama_depan}}" placeholder="Nama Depan" />
</div>
<div class="6u$ 12u$(xsmall)">
Nama belakang:
<input type="text" name="nama_belakang" id="email" value="{{$p->nama_belakang}}" placeholder="Nama Belakang" />
</div>
<div class="12u$">
No. KTP:
<input type="text" name="ktp" value="{{$p->no_ktp}}" placeholder="Nomor KTP Anda">
</div>
<div class="12u$">
Alamat:
<input type="text" name="alamat" value="{{$p->alamat}}" placeholder="Tuliskan Alamat Anda">
</div>
<div class="12u$">
Tanggal lahir:
<input type="text" name="tanggal_lahir" value="{{$p->tanggal_lahir}}" placeholder="Tanggal Lahir" class="datepicker1">
</div>
<div class="12u$">
Agama: <br>
<select name="agama" id="category">
<option value="{{$p -> agama}}">{{$p -> agama}}</option>
<option value="Kristen Protestan">Kristen Protestan</option>
<option value="Kristen Katolik">Kristen Katolik</option>
<option value="Islam">Islam</option>
<option value="Konghucu">Konghucu</option>
<option value="Hindu">Hindu</option>
<option value="Budha">Budha</option>
</select>
</div>
<div class="12u$">
Jenis Kelamin: <br>
#if($p->jenis_kelamin=='L')
<select name="jenis_kelamin" id="category">
<option value="L" selected>Laki-laki</option>
<option value="P">Perempuan</option>
</select>
#elseif($p->jenis_kelamin=='P')
<select name="jenis_kelamin" id="category">
<option value="L">Laki-laki</option>
<option value="P" selected>Perempuan</option>
</select>
#else
<select name="jenis_kelamin" id="category">
<option value="" selected>Jenis Kelamin Anda</option>
<option value="L">Laki-laki</option>
<option value="P" >Perempuan</option>
</select>
#endif
</div>
<div class="6u 12u$(xsmall)">
TB:
<input type="text" name="tb" id="name" value="{{$p->tb}}" placeholder="TB Anda" />
</div>
<div class="6u$ 12u$(xsmall)">
BB:
<input type="text" name="bb" id="email" value="{{$p->bb}}" placeholder="BB Anda" />
</div>
<div class="12u$">
Golongan Darah: <br>
<select name="goldar" id="category">
<option value="{{$p -> gol_darah}}">{{$p -> gol_darah}}</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="AB">AB</option>
<option value="O">O</option>
</select>
</div>
<div class="12u$">
Status Perkawinan: <br>
<select name="status_perkawinan" id="category">
<option value="{{$p -> status_perkawinan}}">{{$p -> status_perkawinan}}</option>
<option value="1">Kawin</option>
<option value="2">Belum Kawin</option>
</select>
</div>
<div class="12u$">
Apakah anda mempunyai Alergi?
<input type="text" name="alergi" value="{{$p->alergi}}" placeholder="Apakah anda mempunyai Alergi">
</div>
<div class="12u$">
<ul class="actions">
<li><input type="submit" value="Update" class="special" /></li>
</ul>
</div>
</div>
</form>
#endforeach
</section>
</div>
</section>
<script src="{{asset('jquery-ui/jquery-ui.min.js')}}"></script>
#endsection
You might want check your client side errors first on the browser. That will give you a clear picture of "what exactly is wrong?".
I'm trying to pass in the dropdown menu selection to a function in my Javascript File. This works, but as soon as I hit the submit button the dropdown menu choices get deleted, and I'm left with an empty dropdown menu. (This seems to only happen when it's an app in google scripts.)
Any thoughts why this is happening? Is there a better way to do this with apps script?
Any help would be greatly appreciated.
function doSomething(){
var x = document.getElementById("API_key").value;
document.getElementById("API_key").innerHTML = x;
var subdomain =document.getElementById("subdomain").value;
document.getElementById("subdomain").innerHTML = subdomain;
var state = document.getElementById("stateSelect").value;
document.getElementById("stateSelect").innerHTML = state;
google.script.run.getInfo(x,subdomain,state);
}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
<head>
<base target="_top">
</head>
<body>
<P ALIGN=Center>
<BLOCKQUOTE>
<P ALIGN=Left>
<div class="inline form-group">
<label for="API_key">API Key</label>
<input type="text" id="API_key" style="width: 150px;" value="Enter API key here!">
</div>
<P ALIGN=Left>
<div class="inline form-group">
<p>
<label for="Subdomain">Subdomain</label>
<input type="text" id="subdomain" style="width: 150px;">
</p>
</div>
<select id ="stateSelect">
<option value="">All</option>
<option value="&state=active">Active</option>
<option value="&state=past_due">Past Due</option>
<option value="&state=canceled">Canceled</option>
<option value="&state=expired">Expired</option>
<option value="&state=trialing">Trialing</option>
</select>
<div>
<input type="checkbox" id="Product Info" checked>
<label for="Product Info">Product Info</label>
</div>
<div>
<input type="checkbox" id="Shipping Info">
<label for="Shipping Info">Shipping Info</label>
</div>
<div>
<p>
<input class="action" type="button" onclick="doSomething()" value="Get Info!" />
</p>
</div>
</BLOCKQUOTE>
</body>
</html>
function doSomething(){
var x = document.getElementById("API_key").value;
var subdomain =document.getElementById("subdomain").value;
var state = document.getElementById("stateSelect").value;
google.script.run.getInfo(x,subdomain,state);
}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
<head>
<base target="_top">
</head>
<body>
<P ALIGN=Center>
<BLOCKQUOTE>
<P ALIGN=Left>
<div class="inline form-group">
<label for="API_key">API Key</label>
<input type="text" id="API_key" style="width: 150px;" value="Enter API key here!">
</div>
<P ALIGN=Left>
<div class="inline form-group">
<p>
<label for="Subdomain">Subdomain</label>
<input type="text" id="subdomain" style="width: 150px;">
</p>
</div>
<select id ="stateSelect">
<option value="">All</option>
<option value="&state=active">Active</option>
<option value="&state=past_due">Past Due</option>
<option value="&state=canceled">Canceled</option>
<option value="&state=expired">Expired</option>
<option value="&state=trialing">Trialing</option>
</select>
<div>
<input type="checkbox" id="Product Info" checked>
<label for="Product Info">Product Info</label>
</div>
<div>
<input type="checkbox" id="Shipping Info">
<label for="Shipping Info">Shipping Info</label>
</div>
<div>
<p>
<input class="action" type="button" onclick="doSomething()" value="Get Info!" />
</p>
</div>
</BLOCKQUOTE>
</body>
</html>
This is not necessary .just comment and check it
function doSomething(){
var x = document.getElementById("API_key").value;
document.getElementById("API_key").innerHTML = x;
var subdomain =document.getElementById("subdomain").value;
document.getElementById("subdomain").innerHTML = subdomain;
var state = document.getElementById("stateSelect").value;
//document.getElementById("stateSelect").innerHTML = state;
google.script.run.getInfo(x,subdomain,state);
}