peponi/frontend_editing

## frontend_editing
<html>
<head>
  <title></title>

	<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>

	<style>
	.edit{width: 100px;margin-left:20px;}
	input
	{
		border: 1px solid black;
		padding: 3px;
	}
	input:focus
	{
		box-shadow: 0px;
	}
	</style>
</head>
<body>

	<div class="edit" ><p name="val1">klick mich</p></div><br>
	<div class="edit" ><p name="val2">alter</p></div></br>
	<div class="edit" ><p name="val3">emailemailemailemailemailemailemailemailemailemailemailemaemailemailemailemailemailemailemailemailemailemailemailema</p></div><br>
</body>
</html>

<script>
	$(".edit").on("click",function()
	{
		var text = $(this).text();
		var name = $(this).find("p").attr("name");

		if($(this)[0]["nodeName"] != "INPUT" && !$(this).hasClass("onedit"))
		{

			var fieldType = $(this)[0]["lastChild"]["localName"];

			$(this).find("p").hide();
			if($(this).children().length <=1 && text.length > 100)
			{
				$(this).append('<textarea rows="4" cols="50" name="'+name+'">'+text+'</textarea>');
			}
			else if( $(this).children().length <=1  )
			{
				$(this).append('<input type="text" value="'+text+'" name="'+name+'">');
			}
			else
			{
				if(fieldType == "textarea")
				{
					$(this).find(fieldType).show().text(text);
				}
				else
				{
					$(this).find(fieldType).show().val(text);
				}
			}

			$(this).find(fieldType).focus();
		}


		$(this).addClass("onedit");


	})

	$(".edit").on("focusout",function()
		{
			var fieldType = $(this)[0]["lastChild"]["localName"];
			var text = $(this).find(fieldType).val();
			var name = $(this).find(fieldType).attr("name");

			$.post("/URB_BASE/"+text, { value: text, name: name }, null, null);

			$(this).find(fieldType).hide();
			$(this).find("p").show().text(text);
			$(this).removeClass("onedit");


		});


</script>
	<html>
	<head>
	<title></title>

	<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>

	<style>
	.edit{width: 100px;margin-left:20px;}
	input
	{
	border: 1px solid black;
	padding: 3px;
	}
	input:focus
	{
	box-shadow: 0px;
	}
	</style>
	</head>
	<body>

	<div class="edit" ><p name="val1">klick mich</p></div><br>
	<div class="edit" ><p name="val2">alter</p></div></br>
	<div class="edit" ><p name="val3">emailemailemailemailemailemailemailemailemailemailemailemaemailemailemailemailemailemailemailemailemailemailemailema</p></div><br>
	</body>
	</html>

	<script>
	$(".edit").on("click",function()
	{
	var text = $(this).text();
	var name = $(this).find("p").attr("name");

	if($(this)[0]["nodeName"] != "INPUT" && !$(this).hasClass("onedit"))
	{

	var fieldType = $(this)[0]["lastChild"]["localName"];

	$(this).find("p").hide();
	if($(this).children().length <=1 && text.length > 100)
	{
	$(this).append('<textarea rows="4" cols="50" name="'+name+'">'+text+'</textarea>');
	}
	else if( $(this).children().length <=1 )
	{
	$(this).append('<input type="text" value="'+text+'" name="'+name+'">');
	}
	else
	{
	if(fieldType == "textarea")
	{
	$(this).find(fieldType).show().text(text);
	}
	else
	{
	$(this).find(fieldType).show().val(text);
	}
	}

	$(this).find(fieldType).focus();
	}


	$(this).addClass("onedit");



	})

	$(".edit").on("focusout",function()
	{
	var fieldType = $(this)[0]["lastChild"]["localName"];
	var text = $(this).find(fieldType).val();
	var name = $(this).find(fieldType).attr("name");

	$.post("/URB_BASE/"+text, { value: text, name: name }, null, null);

	$(this).find(fieldType).hide();
	$(this).find("p").show().text(text);
	$(this).removeClass("onedit");


	});



	</script>