При натискане на Enter в textarea да се изпраща POST?

streleca_stz

Registered
Здравейте! Искам да ви попитам как се прави номера когато някой натисне ентър да се изпраща заявката?

Както и още един въпрос.. как се прави номера когато не си кликнал в/у полето да изписва текст, като цъкнеш да изчезне и ако нищо не си написал пак да се връща текста?
 
всеки клавиш си има собствен номер, ако имаш firebug го виж от там и след това с jquery Правиш bind keypress
 
По втория ти въпрос:

1. Ако използваш HTML 5, прочети за placeholder.
HTML:
<input type="text" name="first_name" placeholder="Въведи своето име..." />

2. Ако не използваш HTML 5, тогава ти трябва javascript
HTML:
<input type="text" name="first_name" value="Въведи своето име..." onfocus="javascript: if(this.value == 'Въведи своето име...') { this.value = ''; }" onblur="javascript: if(this.value == ''){ this.value = 'Въведи своето име...' }" />
 
Мерси @exec, така работи!

@macmen
Ами потърсих в нета някакви скриптчета и попаднах на това, но не мога да го подкарам нещо :idea:
 
Примера по-долу показва как при натискане на клавиш Enter в textarea, вместо преминаване на нов ред, събмитва формуляра. За по-лесно, използвам jQuery, макар че може да се направи и със стандартен Javascript.

Обяснение за HTML кода - формуляр с id = myForm и вички минимално необходими атрибути като method и action. За целите на примера, за да не се претрупва с HTML код, формуляра има само един елемент - textarea с име и id = description.

Обяснение за Javascript кода - включваме библиотеката jQuery и когато страницата се е заредила напълно, използваме т.н. event listener (радар, прихващащ събития, случили се в рамките на текущата страница) да следи за натиснат Enter в textarea-та, и когато това събитие се случи, да изпълни някаква функция. Ако функцията е създадена предварително, трябва само да и напишем името:

[js]$('#description').bind('keypress', myFunction);[/js]

Ако действието, което изпълнява функцията ще се ползва само на това място и никъде другаде, по-лесно е да се използва анонимна функция, като тази в примера

[js]$('#description').bind('keypress', function(e){
//js code goes here
});[/js]

Първия параметър в тази (callback, event handler) функция, съдържа обекта на съответното събитие и цялата информация за него

Използвайки обекта на събитието, стигаме но номера на клавиша, който е натиснат. Правиме и една елементарна проверка за да сме сигурни, че данните в key са от тип целочислена стойност, та дори и да е нула, това е ОК.

Ако натиснатия клавиш е Enter (номер 13), изпълняваме нашия код, а в случая:

1. Чрез обета на събитието, спираме поведението на клавиша по подразбиране. По подразбиране, натискането на Enter в textarea води до нов ред, но нашата цел е submit на формуляра.

2. Откриваме формуляра чрез неговото id - $('#myForm') и го събмитваме. Резултата от това действие ще се появи под формуляра.

Код:
  <html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript">
	
	$(function(){

		//bind the keypress event to the textarea element
		$('#description').bind('keypress', function(e){

			//be sure we have a number
			var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;

			//enter key
			if(key == 13){	

				//prevent default behaviour 
				e.preventDefault();

				//submit the form
				$('#myForm').submit();
			}
		});
	});

    </script>

  </head>
  <body>
	<form method="post" action="enter.php" id="myForm">
		<textarea name="description" id="description" rows="4" cols="40"></textarea>
	</form>

	<pre><?php if($_POST) print_r($_POST); ?></pre>	
  </body>
  </html>
 
Уау, мерси @exec! :)

И само последно да попитам как мога да направя част от текста който ще се появява в текст ареата да е на нов ред?
 
Това е малко неясно коя част от текста искаш да се появи на нов ред и другото неясно - от къде идва този текст?

Ако искаш в textarea-та предварително да имама някакъв попълнен текст и след него да започва текста на потребителя:

Код:
<?php
$predefined_text = "след този ред започва на нов ред с един ред разстояние\n\n";

<textarea name="description" id="description" rows="4" cols="40"><?php echo $predefined_text; ?></textarea>

Аналогично ако искаш твоя текст да започва по-надолу, слагаш знаците за нов ред в началото на твоя текст.

Но все пак не забравяй, че потребителя може да кликне където и да е и да промени всичко в textarea-та, така че не отдавай голямо внимание на това форматиране.
 

Back
Горе