I have a form that I'm using within Twitter Bootstrap 3. The form posts data to a mysql database and the placeholder values are echoed from the database. I have used a <textarea> input in the 'bio' field but for some reason the placeholder text behaves differently here. I can't drop a cursor and edit a particular word like I can with the other fields. Why is this?
<div class="form-group">
<form class="" action="" id="edit_profile" method="post">
<label>
Name
</label>
<input id="user_name" name="user_name" type="text" placeholder="<?php echo $user_name ; ?>" value="<?php echo $user_name ; ?>" class="form-control input-md" required="">
</div>
Email
</label>
<input id="user_email" name="user_email" type="text" placeholder="<?php echo $user_email; ?>" value="<?php echo $user_email; ?>" class="form-control input-md" required="">
</div>
Bio
</label>
<textarea style="width:100%" value="<?php echo $bio; ?>" placeholder="<?php echo $bio; ?>" name="bio"></textarea>
</div>
<input type="hidden" name="user_id" value="<?php echo $_SESSION['user_session'] ?>">
<button type="submit" class="btn btn-small btn-green pull-right" id="submit">
Save
</button>
</form>
Textarea-text does not go in the value= it goes between the <textarea><?php echo $bio; ?></textarea> tags.
<textarea placeholder="This is a placeholder">This is the actual text</textarea>
You cannot have a value= on a <textarea> since it will stay the same regardless of what you put inside the <textarea> and therefore won't change anything regardless of what you type. (Try removing the "This is the actual text" in the example)
Related
I have the following code and the captcha field need to be only say 10 characters. As is the length seems to be endless.
I wanted the webpage field for the captcha to be only say 7 characters only.
<div class=" col-sm-4 ">
<div id="myapp" ng-controller="subscribe_controller">
<h4 style="color:black;" >Subscribe</h4>
<form id="subscribe_01">
<h4>
<p ng-bind="msg2"></p>
<input id="email2" style="color:gray;" type="text" name="EMAIL" placeholder="Your Email Adddress" value="" ng-model="email2"></h4>
<input id="token2" class="w3-input w3-section" type="hidden" name="token2" value="<?php echo $token;?>" >
<p>Code :<input id="captcha" type="text" placeholder="" required name="captcha" value="" ng-model="captcha" length="7" aw-limit-
length="3"><p>
<button class="w3-button w3-black" ng-click="postData_subscribe()" id="buttoncontact_subscribe">Send To Subscribe</button></p>
</form>
</div
>
I was the size option, so may ng-min ng-max .etc. but it was the old size
I have a page that displays some info about a project in a "container", within that container there are some different fields along with 2 buttons that access different pages. I am having an issue getting the buttons to line up horizontally, how can I get this done? I am thinking it has something to do with the way the forms are rendered, is there a better way than forms? can you style forms with css doing like
display: inline
This is the first time I have messed around with HTML, here is my code thanks:
<div class="project-container">
<label class="boldLabel">Project ID:</label>
<span><?php echo $pId; ?></span><br>
<label class="boldLabel">Project Owner:</label>
<span><?php echo $pName; ?></span><br>
<label class="boldLabel">Project Description:</label>
<span><?php echo $pDesc; ?> </span><br><br>
<label class="boldLabel">Project Due Date:</label>
<span><?php echo $dDate; ?> </span><br>
<form action="delete.php" method="GET">
<input type="hidden" name="pId" value="<?php echo $pId; ?>">
<button class="buttonDelete" type="submit" name="delete">Delete Project</button>
</form>
<form action="update.php" method="GET">
<input type="hidden" name="pId" value="<?php echo $pId; ?>">
<input type="hidden" name="pName" value="<?php echo $pName; ?>">
<input type="hidden" name="pDesc" value="<?php echo $pDesc; ?>">
<input type="hidden" name="dDate" value="<?php echo $dDate; ?>">
<button class="buttonUpdate" type="submit" name="update">Update Project</button>
</form>
</div>
</div>
You don't need any 2 forms on your file. You just need 1 general form tag that handles both process (delete and update). These process can be managed throught Javascript functions and events.
Note: The problem about the 2 buttons not being aligned horizontally is because you have certain elements on different form tags. You could do some extra work with css but having 2 forms in one file is normally avoided by developers unless this could be the only way to a certain process.
I fixed the code. You can see the snippet working here:
function buttoncheck(action)
{
//$("project-container").load("process.php", {action: action});
// This is an example of how you could "call" process.php
}
<form action="process.php" method="post">
<div id="project-container" class="project-container">
<label class="boldLabel">Project ID:</label>
<span><?php echo $pId; ?></span><br>
<label class="boldLabel">Project Owner:</label>
<span><?php echo $pName; ?></span><br>
<label class="boldLabel">Project Description:</label>
<span><?php echo $pDesc; ?> </span><br><br>
<label class="boldLabel">Project Due Date:</label>
<span><?php echo $dDate; ?> </span><br>
<input type="hidden" name="pId" value="<?php echo $pId; ?>">
<input type="hidden" name="pId" value="<?php echo $pId; ?>">
<input type="hidden" name="pName" value="<?php echo $pName; ?>">
<input type="hidden" name="pDesc" value="<?php echo $pDesc; ?>">
<input type="hidden" name="dDate" value="<?php echo $dDate; ?>">
<button class="buttonDelete" type="button" name="delete" onClick="buttoncheck(0)">Delete Project</button>
<button class="buttonUpdate" type="button" name="update" onClick="buttoncheck(1)">Update Project</button>
</div>
</form>
And in the "process.php" file
<?php
$action=$_POST['action'];
// To Update
if($action=1){
// update code here
}
if($action=0){
// delete code here
}
You can check how to refresh div content, onclick function, css manage in this links:
Load jquery method
Load Jquery method 2
onclick function
button css design process
I am working on my school work and I am trying to add subtitles when user upload video to webpage. The source code was created earlier and I only added code at row 12 -18.
<div class="form-group">
<input type="checkbox" id="inputCheck" name="enhancement">
<label for="inputCheck"> Add subtitles(text): </label>
<form id="post" accept-charset="UTF-8" name="post" method="post" action="/application/controllers/media.php">
<textarea rows="5" cols="85" name="blogentry" form="post"></textarea>
<input class="button" type="submit" value="Submit">
</form>
</div>
I tried this code alone and it works, so it saved subtitles to file on server. But when I added it to this source code it doesn't work. I know it doesn't work because there is "form in form". Please kindly I need your help. I don't know how to transfer this two forms to just one form. I am new in HTML and I don't know how to do it.
<form action="<?php echo base_url();?>media/upload" class="form-horizontal" enctype="multipart/form-data" method="post" id="form1">
<div class="form-group">
<select name="gender" class="form-control hide-scroll" size="<?php echo sizeof($gender_list);?>">
<?php foreach($gender_list as $key => $gender):?>
<option <?php if($key==0) echo 'selected="selected"';?> value="<?php echo $gender['gender_name'];?>"><?php echo $gender['gender_name'];?></option>
<?php endforeach; ?>
</select>
</div>
<div class="form-group">
<label for="inputFile" class="col-sm-2 control-label input-sm m-bot15">Add file:</label>
</div>
<div class="form-group">
<input type="checkbox" id="inputCheck" name="enhancement">
<label for="inputCheck"> Add subtitles(text): </label>
<form id="post" accept-charset="UTF-8" name="post" method="post" action="/application/controllers/media.php">
<textarea rows="5" cols="85" name="blogentry" form="post"></textarea>
<input class="button" type="submit" value="Submit">
</form>
</div>
<div class="form-group">
<button type="submit" class="btn btn-info col-sm-12"><i class="glyphicon glyphicon-arrow-up"></i> Upload</button>
</div>
</form>
You don't need two forms there. You need only one form on client-side and script, which adds subtitles to DB/file if $_POST['inputCheck'] == true - on server-side. You only need to reorganize server-side script.
On client-side you only need to remove internal 'form' tag.
On server-side you need to move script from '/application/controllers/media.php' to 'media/upload'. That's all.
I'm creating a register form which requires a 'check if username available' button.
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<div id="availablity">
<input type="text" name="name" value="<?php _e("Username") ?>" style="float: left;"/>
<span id="availability_status" style="float: left;">icon here</span>
<input type="submit" name="check" value="<?php _e("Check") ?>" style="float: left;"/>
<div style="clear: both;"
</div>
<input type="text" name="mail" value="<?php _e("E-Mail") ?>" id="" class="input" />
<input type="submit" value="<?php _e("Register") ?>" id="register" />
<p class="statement"><?php _e("A password will be e-mailed to you.") ?></p>
</form>
The button, on line 5, contains text that is translatable, hence the value will change. The code works, when 'Check' is clicked an extra query named 'check' is submitted, and clicking 'Submit' the 'check' is disregarded. Is there any way I can change the text while keeping a default value (possibly '1'). Currently, all I can do server side is check if a query named 'check' was submitted and not bother with it's value.
Instead of an <input>, where the value is exactly the same as the text on the screen, use a <button> where the text on the screen can be anything you want.
In other words, change
<input type="submit" name="check" value="<?php _e("Check") ?>"
style="float: left;"/>
to
<button type="submit" name="check" value="1" style="float: left;">
<?php _e("Check") ?>
</button>
so that it will always have the value 1, no matter the text! (Of course you can use whatever value you want.)
I have done textareas before but this one is just killing me. The text area is showing the html code and is not css'ed properly. So in the actual window I get the code for the textarea's element and it shows the rest of my code in it as well, instead of rendering it. Without the textarea tag everything works peachy.
<article>
<form method="POST" name="form9" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<label for="firstName">First Name <sup>*</sup></label>
<input type="text" id="firstName" name="firstName" required />
<label for="lastName">Last Name <sup>*</sup></label>
<input type="text" id="lastName" name="lastName"/>
<label for="wrstyle">Writing Style <sup>*</sup></label>
<textarea placeholder="Please, briefly describe your writing style." type="text" id="wrstyle" name="wrstyle"</textarea>
<label for="submit" class="centerit" title="Click here to register your account">
<input type="submit" name="submit" value="Sign Up" />
</label>
<p class="notice"><sup>*</sup> denotes a required field.</p>
</form>
</article>
You don't close opening tag of the textarea (you are missing >):
http://jsfiddle.net/Bvk92/
It's also worth noting that <textarea> has no type attribute.
You forgot to close tag of text area .......
<article>
<form method="POST" name="form9" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<label for="firstName">First Name <sup>*</sup></label>
<input type="text" id="firstName" name="firstName" required />
<label for="lastName">Last Name <sup>*</sup></label>
<input type="text" id="lastName" name="lastName"/>
<label for="wrstyle">Writing Style <sup>*</sup></label>
<textarea placeholder="Please, briefly describe your writing style." type="text" id="wrstyle" name="wrstyle"></textarea>
<label for="submit" class="centerit" title="Click here to register your account">
<input type="submit" name="submit" value="Sign Up" />
</label>
<p class="notice"><sup>*</sup> denotes a required field.</p>
</form>
</article>