...

View Full Version : Resolved Return back to <p> from textarea?



RiskyShenanigan
11-07-2011, 09:42 PM
Hi, I currently have a <div> with a <p> and have an edit button that when clicked will transform it into a textarea using jQuery's .html().

I also have a cancel button which allows the user to cancel the edit and return the textarea to the previous content, any ideas how I do this?

JavaScript

// JavaScript Document
jQuery(document).ready(function(e) {

$('#edit_p').click(function(e){
$('#cancel_p').show();
$('#greeting').html("<textarea id='txt_greeting' cols='20'>" + $('#greeting p').text() + "</textarea>");
$(this).hide();
});

$('#cancel_p').click(function(e){
$('#edit_p').show();
$(this).hide();
});

});

HTML

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Textarea/Button Change</title>
<script type="text/javascript" src="jquery-1.7.js"></script>
<script type="text/javascript" src="txt_area_jquery.js"></script>
<link rel="stylesheet" type="text/css" href="txt_area_style.css" />
</head>

<body>
<div id="greeting"><p>Hello, today is a great day!</p></div>
<input type="button" name="edit_p" id="edit_p" value="Edit" />
<input type="button" name="cancel_p" id="cancel_p" value="Cancel" />

<?php

?>
</body>
</html>

RiskyShenanigan
11-07-2011, 10:13 PM
Problem fixed.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum