Jump to content

Using If Statement In Form To Display 2 Extra Input Tags Help

oalvarado

By oalvarado
in PHP Coding Help

 Share

Recommended Posts

oalvarado Newbie

oalvarado

Posted
Posted (edited)

Hi all,

I'm trying to display 2 extra input tags if the user selects two options from a six option drop down in a form, so it would look like so:

If option A,B selected = true,

then echo 2 extra inputs,

else

if options C,D,E,F selected = false

then do not display inputs.

By the way I'm a beginner php programmer (need experience) so I coded my form with the php in the spots where need, DW does no display syntax error so I'm guessing is correct but when I preview in browser inputs show when they are not supposed to. Can someone please advice and if possible explain my problem,my code for the form is below:

 

Thanks in acvance

 

<form method="post" action="">
<label for="titulo">Titulo de Listado: </label>
<input type="text" placeholder="Ave. Jalisco #560" name="titulo">
<br />
<label for="Direccion">Direccion: </label>
<input type="text" placeholder="Ave. Jalisco #560 Colonia Cacho Tijuana Baja California Mexico 22407" name="direccion">
<br />
<label for="email">Correo Electronico: </label>
<input type="email" placeholder="123JuanCastro@Tucorreo.com" name="email">
<br />
<label for="accion">Accion Deseada: </label>
<select>
<option value="Vender">Vender</option>
<option value="Rentar">Rentar: </option>
</select>
<br />

<label for="Descripcion">Descripcion del Inmueble</label>
<br />
<textarea placeholder="Descripcion completa del inmueble" name="descripcion" rows=8 cols=30 style="max-width:400px; width:400px; height:150px; font-family:'sansation_light'; max-height:150px; overflow:auto; margin-top:10px;"></textarea>
<br />
<?php
$do = 'Casa';
$do1 = 'Depto';
?>
<label for="inmueble">Tipo de Inmueble: </label>
<select>
<option>Seleccionar</option>
<option value="Casa">Casa</option>
<option value="Depto">Departamento</option>
<option value="Oficina">Oficina</option>
<option value="Terreno">Terreno</option>
<option value="Nave">Nave Indust.</option>
</select>
<br />
<?php
if ($do = true);
echo '<label for="cuartos"># de Recamaras: </label>
<input type="text" placeholder="3" name="cuartos">';
?><br />
<?php
if ($do1 = true);
echo '<label for="baños">Cantidad de Baños: </label>
<input type="text" placeholder="1.5" name="baños">';
?><br />
<label for="Superficie">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" placeholder="150" name="superficie">
     
<select>
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="construccion">Superficie<sup>2</sup> de Construccion: </label>
<input type="text" placeholder="150" name="superficie">
     
<select>
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio">Precio: </label>
<input type="text" placeholder="$1500" name="precio">
    
<select>
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br />
</form>

Edited by oalvarado
trq Prolific Member

trq

Posted
Posted

Your code makes little sense. At one place you set $do to the string 'Casa', you later then attempt to check to see if $do is true (the comparison operator is == in php, not =).

 

Anyway, what your trying to do would be best done client side using Javascript, not server side using PHP.

Mancent Member

Mancent

Posted
Posted (edited) 

<form method="post" action="">
<label for="titulo">Titulo de Listado: </label>
<input type="text" placeholder="Ave. Jalisco #560" name="titulo">
<br />
<label for="Direccion">Direccion: </label>
<input type="text" placeholder="Ave. Jalisco #560 Colonia Cacho Tijuana Baja California Mexico 22407" name="direccion">
<br />
<label for="email">Correo Electronico: </label>
<input type="email" placeholder="123JuanCastro@Tucorreo.com" name="email">
<br />
<label for="accion">Accion Deseada: </label>
<select>
<option value="Vender">Vender</option>
<option value="Rentar">Rentar: </option>
</select>
<br />


<label for="Descripcion">Descripcion del Inmueble</label>
<br />
<textarea placeholder="Descripcion completa del inmueble" name="descripcion" rows=8 cols=30 style="max-width:400px; width:400px; height:150px; font-family:'sansation_light'; max-height:150px; overflow:auto; margin-top:10px;"></textarea>
<br />
<?php
$do = 'Casa'; //THIS IS MAKING IT TRUE AREADY YOU NEED TO TELL IT WHEN IT IS TRUE OF FALSE
$do1 = 'Depto';//THIS IS MAKING IT TRUE AREADY YOU NEED TO TELL IT WHEN IT IS TRUE OF FALSE
?>
<label for="inmueble">Tipo de Inmueble: </label>
<select>
<option>Seleccionar</option>
<option value="Casa">Casa</option>
<option value="Depto">Departamento</option>
<option value="Oficina">Oficina</option>
<option value="Terreno">Terreno</option>
<option value="Nave">Nave Indust.</option>
</select>
<br />
<?php
if ($do =='Casa')
{
echo '<label for="cuartos"># de Recamaras: </label>
<input type="text" placeholder="3" name="cuartos">';
}
?><br />
<?php
if ($do1 =='Depto')
{
echo '<label for="baños">Cantidad de Baños: </label>
<input type="text" placeholder="1.5" name="baños">';
}
?><br />
<label for="Superficie">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" placeholder="150" name="superficie">
     
<select>
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="construccion">Superficie<sup>2</sup> de Construccion: </label>
<input type="text" placeholder="150" name="superficie">
     
<select>
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio">Precio: </label>
<input type="text" placeholder="$1500" name="precio">
    
<select>
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br />
</form>

 

 

I would user div tags for this.. give them som ID and then java it.. Here is a simple code! on minute

Edited by Mancent
Mancent Member

Mancent

Posted
Posted (edited)

my bad. just quick talk.

 

<style type="text/css">
span.About {
background:url(images/ABOUT.png) top center no-repeat;

display:block;
height:26px;
border:none;



}
span.AboutMore {
background:url(images/ABOUT.png) top center no-repeat;

display:block;
height:26px;
border:none;



}
</style>



THIS IS MY DROP DOWN MENU TO DISPLAY.<br />


<select>
<option>Seleccionar</option>
<option value="Casa" onclick="javascript:Function_Name();"><a href="#">Casa</a></option>
<option value="Casa" onclick="javascript:Function_Name_2();"><a href="#">Departamento</a></option>
</select><br />



THIS IS MY BUTTON TO DISPLAY MY FUNCTION BLOCK!<br />
<!--THIS IS USING THE CSS CLASS FOR YOUR BUTTON UP AT THE TOP AND THE JAVA SCRIPT onclick AT THE BOTTOM-->
<span class="About" onclick="javascript:Function_Name();"><a href="#"></a></span><br />


<!--THIS IS USING THE CSS CLASS FOR YOUR BUTTON UP AT THE TOP AND THE JAVA SCRIPT onclick AT THE BOTTOM-->
<span class="AboutMore" onclick="javascript:Function_Name_2();"><a href="#"></a></span><br />

<!--THIS IS THE DIV TAG WITH A ID THAT THE JAVA SCRIPT IS LOOKING FOR-->
<div id="myfuction" style="display: none;padding: 5px;">
THIS IS MY FUCTION TEST BLOCK I WANT TO DISPLAY!
</div>

<!--THIS IS THE DIV TAG WITH A ID THAT THE JAVA SCRIPT IS LOOKING FOR-->
<div id="myfuction_2" style="display: none;padding: 5px;">
THIS IS MY FUCTION TEST BOCK 2 I WANT TO DISPLAY!
</div>
<script type="text/javascript">
function Function_Name()
{
if(document.getElementById('myfuction').style.display=='none')
{
//THIS IS SHOWING THE DIV TAG
div = document.getElementById('myfuction');
div.style.display = "block";

//THIS IS HIDING THE OTHER DIV TAG AND ONLY SHOWING YOU THE ONE
div = document.getElementById('myfuction_2');
div.style.display = "none";


}
else
{
//THIS IS HIDING THE DIV TAG IF YOU CLICK IT TWICE IT OPENS IT SHUTS
div = document.getElementById('myfuction');
div.style.display = "none";
}

}
function Function_Name_2()
{
if(document.getElementById('myfuction_2').style.display=='none')
{
//THIS IS SHOWING THE DIV TAG
div = document.getElementById('myfuction_2');
div.style.display = "block";
//THIS IS HIDING THE OTHER DIV TAG AND ONLY SHOWING YOU THE ONE
div = document.getElementById('myfuction');
div.style.display = "none";


}
else
{
//THIS IS HIDING THE DIV TAG IF YOU CLICK IT TWICE IT OPENS IT SHUTS
div = document.getElementById('myfuction_2');
div.style.display = "none";
}

}
</script>

Edited by Mancent
oalvarado Newbie

oalvarado

Posted
  • Author
Posted

Thanks guys for the help, I used javascript for this and it works like a charm, I know this is the php section but I think it will helpful for other ppl. so here is what I used:

<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Show/Hide</title>
<script type="text/javascript">
// <![CDATA[
function display(obj,id1,id2,id3,id4,id5) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
document.getElementById(id3).style.display = 'none';
document.getElementById(id4).style.display = 'none';
document.getElementById(id5).style.display = 'none';
if ( txt.match(id1) ) {
document.getElementById(id1).style.display = 'block';
}
if ( txt.match(id2) ) {
document.getElementById(id2).style.display = 'block';
}
if ( txt.match(id3) ) {
document.getElementById(id3).style.display = 'block';
}
if ( txt.match(id4) ) {
document.getElementById(id4).style.display = 'block';
}
if ( txt.match(id5) ) {
document.getElementById(id5).style.display = 'block';
}
}
// ]]>
</script>
<script>
// This adds 'placeholder' to the items listed in the jQuery .support object.
jQuery(function() {
jQuery.support.placeholder = false;
test = document.createElement('input');
if('placeholder' in test) jQuery.support.placeholder = true;
});
// This adds placeholder support to browsers that wouldn't otherwise support it.
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$(':text').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
}
});
$(':text').blur();
$(active).focus();
$('form:eq(0)').submit(function () {
$(':text.hasPlaceholder').val('');
});
}
});
</script>
<body>


<form method="post" action="">
<label for="titulo" id="label">Titulo de Listado: </label>
<input type="text" class="input-left" placeholder="Ave. Jalisco #560" name="titulo">
<br />
<label for="Direccion" id="label">Direccion: </label>
<input type="text" class="input-left" placeholder="Ave. Jalisco #560 Colonia Cacho Tijuana Baja California Mexico 22407" name="direccion">
<br />
<label for="email" id="label">Correo Electronico: </label>
<input type="email" class="input-left" placeholder="123JuanCastro@Tucorreo.com" name="email">
<br />
<label for="accion" id="label">Accion Deseada: </label>
<select class="input-left">
<option value="Vender">Vender</option>
<option value="Rentar">Rentar: </option>
</select>
<br />
<label for="Descripcion" id="label">Descripcion del Inmueble</label>
<br />
<textarea class="input-left" placeholder="Descripcion completa del inmueble" name="descripcion" rows=8 cols=30 style="max-width:400px; width:400px; height:150px; font-family:'sansation_light'; max-height:150px; overflow:auto; margin-top:10px; text-align: left;"></textarea>
<br />
<label for="inmueble" id="label" >Tipo de Inmueble: </label>
<select class="input-left" name="type" onchange="display(this,'Casa','Depto','Oficina','Nave','Terreno');">
<option>Sleccionar opcion:</option>
<option value="Casa">Casa</option>
<option value="Depto">Departamento</option>
<option value="Oficina">Oficina</option>
<option value="Nave">Nave Indust.</option>
<option value="Terreno">Terreno</option>
</select>
<br/>
<!-- option Casa -->
<div id="Casa" style="display:none;">
<label for="cuartos" id="label">Cantidad de Recamaras: </label>
<input type="text" class="input-left" placeholder="3" name="recamaras">
<br />
<label for="baños" id="label">Cantidad de Baños: </label>
<input type="text" class="input-left" placeholder="1.5" name="baños">
<br />
<label for="Superficie" id="label">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" class="input-left" placeholder="150" name="superficie" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="construccion" id="label">Superficie<sup>2</sup> de Construccion: </label>
<input type="text" class="input-left" placeholder="150" name="construcion" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio" id="label">Precio: </label>
<input type="text" class="input-left" placeholder="$1500" name="precio">
    
<select class="input-left">
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br /></div>
<!-- option Departamento -->
<div id="Depto" style="display:none;">
<label for="cuartos" id="label">Cantidad de Recamaras: </label>
<input type="text" class="input-left" placeholder="3" name="recamaras">
<br />
<label for="baños" id="label">Cantidad de Baños: </label>
<input type="text" class="input-left" placeholder="1.5" name="baños">
<br />
<label for="Superficie" id="label">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" class="input-left" placeholder="150" name="superficie" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="construccion" id="label">Superficie<sup>2</sup> de Construccion: </label>
<input type="text" class="input-left" placeholder="150" name="construcion" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio" id="label">Precio: </label>
<input type="text" class="input-left" placeholder="$1500" name="precio">
    
<select class="input-left">
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br /></div>
<!-- option Oficina -->
<div id="Oficina" style="display:none;">
<label for="Oficina" id="label">Cantidad de Cubiculos: </label>
<input type="text" class="input-left" placeholder="3" name="cubiculos">
<br />
<label for="baños" id="label">Cantidad de Baños: </label>
<input type="text" class="input-left" placeholder="1.5" name="baños">
<br />
<label for="Superficie" id="label">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" class="input-left" placeholder="150" name="superficie" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio" id="label">Precio: </label>
<input type="text" class="input-left" placeholder="$1500" name="precio">
    
<select class="input-left">
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br /></div>
<!-- option Nave Indust. -->
<div id="Nave" style="display:none;">
<label for="Oficinas" id="label">Cantidad de Cubiculos: </label>
<input type="text" class="input-left" placeholder="3" name="cubiculos">
<br />
<label for="baños" id="label">Cantidad de Baños: </label>
<input type="text" class="input-left" placeholder="1.5" name="baños">
<br />
<label for="Superficie" id="label">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" class="input-left" placeholder="150" name="superficie" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="construccion" id="label">Superficie<sup>2</sup> de Construccion: </label>
<input type="text" class="input-left" placeholder="150" name="construcion" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio" id="label">Precio: </label>
<input type="text" class="input-left" placeholder="$1500" name="precio">
    
<select class="input-left">
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br /></div>
<!-- option Terreno -->
<div id="Terreno" style="display:none;">
<label for="Superficie" id="label">Superficie<sup>2</sup> de Inmueble: </label>
<input type="text" class="input-left" placeholder="150" name="superficie" size="10">
     
<select class="input-left">
<option value="sqf">sqf</option>
<option value="mts">mts</option>
</select>
<br />
<label for="precio" id="label">Precio: </label>
<input type="text" class="input-left" placeholder="$1500" name="precio">
    
<select class="input-left">
<option value="MXN">MXN</option>
<option value="USD">USD</option>
</select>
<br /></div>
</form>
</body>
</html>

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.