<form action="/kalkukator/index.php" method="post">
<table width="54%" class="table table-bordered table-striped table-hover">
<tr>
<th width="7%" class="active">Date</th>
<th width="46%" text-align= "center">Day Shifts</th>
<th width="47%">Night Shifts</th>
</tr>
<tr>
<td class= "active" >1.</td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: transparent; text-align: center;" color: "transparent" name="dan1"></td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: transparent; text-align: center;" color: "transparent" name="noc1"></td>
Ovo je forma koja treba da izracuna neke unete vrednosti, sve funkcionise ali samo kada je dugme SUBMIT ispod (na kraju forme):
> <input type="submit" align="center" value="Izracunaj">
> </form>
S obzirom da mi graficki to dugme treba daleko iznad mesta na kome je trenutno, kako mogu da ga prebacim a da forma i dalje funkcionise?
Bilo bi dobro kada bi stavio screenshot.
Inace ako koristis Jquery mozes ovako
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ime</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<input type="button" value="Submit" id="submit"/>
<table width="54%" class="table table-bordered table-striped table-hover">
<tr>
<th width="7%" class="active">Date</th>
<th width="46%" text-align= "center">Day Shifts</th>
<th width="47%">Night Shifts</th>
</tr>
<tr>
<td class= "active" >1.</td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: black; text-align: center;" color: "transparent" name="dan1" id = "dan1"></td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: black; text-align: center;" color: "transparent" name="noc1" id = "noc1"></td>
</table>
</body>
<script type="text/javascript">
$('#submit').click(function() {
var dan1 = $("#dan1").val();
var noc1 = $("#noc1").val();
$.ajax({
type: "POST",
url: "submit.php",
data: {dan1: dan1, noc1: noc1},
success: function(response){
//do something on success
}
});
});
</script>
I onda u submit.php radiš što već hoćeš sa tim inputima …
Na ovaj način možeš premjestit <input type="button" value="Submit" id="submit"/>
gdje god hoćeš.
drmko
travanj 2017 20:48 9
3
Probaj ovo:
<input type="submit" form="myform" />
<form id="myform" method="get" action="something.php">
<input type="text" name="name" />
</form>
1 Like
<form action="/kalkulator/index.php" method="post">
<table width="54%" class="table table-bordered table-striped table-hover">
<tr>
<th width="7%" class="active">Date</th>
<th width="46%" text-align= "center">Day Shifts</th>
<th width="47%">Night Shifts</th>
</tr>
<tr>
<td class= "active" >1.</td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: transparent; text-align: center;" color: "transparent" name="dan1"></td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: transparent; text-align: center;" color: "transparent" name="noc1"></td>
</tr>
<tr>
<input type="submit" align="center" value="Izracunaj">
@drmko , pokusao sam sa dodavanjem ID-a ali nece.
@MHB2011 , ne koristim jq, samo css+html+php
@Mario_Marius probaj ovako
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ime</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<input type="button" value="Submit" id="submit"/>
<form name = "form1" method="post">
<table width="54%" class="table table-bordered table-striped table-hover">
<tr>
<th width="7%" class="active">Date</th>
<th width="46%" text-align= "center">Day Shifts</th>
<th width="47%">Night Shifts</th>
</tr>
<tr>
<td class= "active" >1.</td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: black; text-align: center;" color: "transparent" name="dan1" id = "dan1"></td>
<td class= "active"><input type="text" style= "width: 320px; color: #000; border-color: black; text-align: center;" color: "transparent" name="noc1" id = "noc1"></td>
</table>
</form>
<span class="label label-primary" id="badge">
</body>
<script type="text/javascript">
$('#submit').click(function() {
var data = $("form[name=form1]").serialize();
$.ajax({
type: "POST",
url: "kalkulator/index.php",
data: data,
success: function(response){
$("#badge").html(response);
}
});
});
</script>
I dalje ne funkcionise, hmmm… nije mi jasno :\
ovo bi trebalo raditi:
<input type="submit" form="myform" />
<form id="myform" method="post" action="/kalkukator/index.php">
<input type="text" name="name" />
</form>
Ak ne radi, aplojdaj cijeli fajl negdje na neki fiddle il neš da pogledam…