Script inside input text

Asked

Viewed 459 times

0

I have an Rand that generates numbers from 0 to 5, wanted that when clicking a button it generates the number inside the input text. I did it in a way but when clicking on the button generate the number is generated outside the input, follows the code:

<?php
session_start();
if(!empty($_SESSION['email'])){
	
}else{
	echo"<script language='javascript' type='text/javascript'>alert('ArÊa Restrita.');
				window.location.href='/bolao/index.php';</script>";
}
$nome=$_SESSION['nome'];

$placarc = substr(mt_rand (0,5),0,1); //gera números de para time casa 0 a 5
$placarf = substr(mt_rand (0,5),0,1); //gera números de para time fora 0 a 5
?>

<!DOCTYPE html>
<html lang="pt-br">
<head>
	<meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel='stylesheet' href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'/>
	<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
	<!-- As 3 meta tags acima *devem* vir em primeiro lugar dentro do `head`; qualquer outro conteÃēdo deve vir *apÃŗs* essas tags -->
    <title>Lance Web</title>
    <!-- Bootstrap -->
    <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- HTML5 shim e Respond.js para suporte no IE8 de elementos HTML5 e media queries -->
    <!-- ALERTA: Respond.js nÃŖo funciona se vocÃĒ visualizar uma pÃĄgina file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
	<style type="text/css">
		/*Aqui deixa a imagem de fundo responsiva*/
		body{ 
			background: url(../img/principal.png) no-repeat center center fixed; 
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover;
		}
		
		#font{
			color:black;
			font-family: 'Open Sans', sans-serif;
			font-size: 20px;
			
		}
		
		#fonttitulo{
			color:black;
			font-family: 'Open Sans', sans-serif;
			font-size: 24px;
			
		}
		
		.img-responsive {
			max-width:250px;
			max-height:150px;
			width: auto;
			height: auto;
			
		}
		
				
	</style>
	
	<!-- Aqui começa o script para gerar um placar para o time casa -->
	<script>
		function myFunction(){
			document.getElementById("casa").innerHTML = <?php echo $placarc; ?>;
		}
	</script>
	
	<!-- Aqui começa o script para gerar um placar para o time fora -->
	<script>
		function myFunction2(){
			document.getElementById("fora").innerHTML = <?php echo $placarf; ?>;
		}
	</script>
</head>
<body>
<!--------------------------------------------------------- nav e o menu ------------------------------------------------------------------->	
<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    
	<!-- Aqui e como ira aparece em um telefone -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <!-- Aqui no span, sÃŖo os 3 pontos ao abrir em um telefone -->
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
	  	<a class="navbar-brand" href="index.php">Voltar</a>
	</div>

    <!-- Aqui se edita a parte do saldo -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   		<ul class="nav navbar-nav">
			<li class=""><a href="partidas.php">Cadastrar Partidas<span class="sr-only">(current)</span></a></li>
			<li class=""><a href="editarpartidas.php">Editar Partidas<span class="sr-only">(current)</span></a></li>
		</ul>
	   		
	   		<!-- Aqui se edita a parte do sair -->  
			 <ul class="nav navbar-nav navbar-right">
				 <li><a href="sair.php"><i class="glyphicon glyphicon-off"></i></a></li>
			 </ul>
        
    </div><!-- fim da div collapse, ela faz com que abra um menu ao aumentar o site -->
  </div><!-- /.container-fluid -->
</nav>

<!------------------------------------------------- Aqui começa o formulario de cadastrar os placares ------------------------------------->	
	<form class="form-group" action="" method="post">
		<div class="container" align="center" >
			<div class="col-md-4 col-md-offset-4"><br><br>
				<label id="font">Time Casa</label>
					<select class="form-control" name="timecasa" required>
						 <option selected></option>
						 <option value="Atletico-go">Atlético-GO</option>
						 <option value="Atletico-mg">Atlético-MG</option>
						 <option value="Atletico-pr">Atlético-PR</option>
						 <option value="Avai">Avaí</option>
						 <option value="Bahia">Bahia</option>
						 <option value="Botafogo">Botafogo</option>
						 <option value="Corinthians">Corinthians</option>
						 <option value="Coritiba">Coritiba</option>
						 <option value="Cruzeiro">Cruzeiro</option>
						 <option value="Chapecoense">Chapecoense</option>
					</select><br>
				
				<label id="font">Placar time Casa</label>	
					<div class="row">
						<div class="col-md-3 col-md-offset-3 col-xs-3" id="casa">
							<input class="form-control" type="text" name="placarcasa" maxlength="1" value="" style="text-align: center;" required></div>
						<div class="col-xs-4">
							<input class="btn btn-success submit-botao" type="submit" value="Gerar" onclick="myFunction()">
						</div>
					</div><hr><br><!-- Fim div row placar casa-->
					
				<label id="font">Time Fora</label>
					<select class="form-control" name="timefora" required>
						<option selected></option>
						<option value="Flamengo">Flamengo</option>
						<option value="Fluminense">Fluminense</option>
						<option value="Gremio">Grêmio</option>
						<option value="Palmeiras">Palmeiras</option>
						<option value="Ponte preta">Ponte Preta</option>
						<option value="Santos">Santos</option>
						<option value="Sao paulo">São Paulo</option>
						<option value="Sport">Sport</option>
						<option value="Vasco">Vasco</option>
						<option value="Vitoria">Vitória</option>
				</select><br>
				
				<label id="font">Placar time fora</label>	
					<div class="row">
						<div class="col-md-3 col-md-offset-3 col-xs-3" id="fora">
							<input class="form-control" type="int" name="placarfora" maxlength="1" value="" style="text-align: center;" required></div>
						<div class="col-xs-4">
							<input class="btn btn-success submit-botao" type="submit" value="Gerar" onclick="myFunction2()">
						</div>
					</div><hr><br><!-- Fim div row placar fora-->
					
					<div class="col-md-4 col-md-offset-1"> 
						<a href="index.php"><input class="btn btn-danger btn-lg" type="button" value="Cancelar"></a>
					</div>
			
					<div class="col-md-5 col-md-offset-1">
						<input class="btn btn-info btn-lg submit-botao" type="submit" value="Cadastrar" name="btnCadastrar">
					</div>
				
			</div><!-- Fim div mover-->
			
		</div><!-- Fim div container -->
		
	</form><!-- Fim formulario-->
		
	</div><!-- Fim Div row-->
	
	</div><!-- Fim Div container-->

<script src='http://code.jquery.com/jquery-2.1.3.min.js'></script>
<script src='//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js'></script>
	
</body>
</html>

php javascript

1 answer

1


In your input you can put a id

<input id="placar-c" class="form-control" type="text" name="placarcasa" maxlength="1" value="" style="text-align: center;" required />

And in your javascript function you arrow the value in the element

function myFunction(){
    document.getElementById("placar-c").value = <?php echo $placarc; ?>;
}

  • Thanks, it worked out.

  • @pherb signals the answer as "correct" by marking a green V. This encourages OS users to continue answering questions.

Browser other questions tagged php javascript

You are not signed in. Login or sign up in order to post.