Форум

Webtest · #1 (**permalink**) 15.07.2014, 13:00

Здравствуйте.

Подскажите пожалуйста, как сделать так, чтобы если я нажал на кнопку:

<form method='get' action='test.php'>
    <button name='rename'>Rename</button>
</form>

То на этой же странице поверх, как бы, перекрывало окошко с кодом:

<form method='post' action='test.php'>
    <input type='text' name='renameFile'>
    <input type='submit' value='Ok'>
</form>

Чтобы я туда ввел текст, нажал на кнопку Ок, и имя файла поменялось. Самое главное, чтобы весь код был на 1 странице, возможно ли такое? Чтобы код появляющегося окна был тоже на текущей странице.
И при нажатии Ок эта форма исчезала, а название файла менялось.
Как-то так.

skrudjmakdak · #2 (**permalink**) 15.07.2014, 13:11

<html>
	<head>
		<title>example</title>
	</head>

	<body>
		<div id="dialog" title="Basic dialog">
			<form method='post' action='test.php'>
				<input type='text' name='renameFile'>
				<input type='submit' value='Ok'>
			</form>
		</div>
		<div><input type='button' value='форма'></div>
		<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
		<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
		<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
		<script>
			var dialog = $("#dialog").dialog({autoOpen: false});
			$("input[type=button]").click(function ()
				{
				dialog.dialog( "open" );
				});
		</script>
	</body>
</html>

skrudjmakdak · #3 (**permalink**) 15.07.2014, 13:14

вот пример не плохой
http://jqueryui.com/dialog/#modal-form

Webtest · #4 (**permalink**) 15.07.2014, 13:21

skrudjmakdak, skrudjmakdak, спасибо, сейчас буду изучать что да как!

Webtest · #5 (**permalink**) 15.07.2014, 15:04

skrudjmakdak, такой вопрос, а как сделать так, чтобы окно переименовывания открывалось не при нажатии на любой инпут, а при нажатии на кнопку с определенным именем?
Например: '<button name="changeName">Переименовать</button>';

skrudjmakdak · #6 (**permalink**) 15.07.2014, 15:08

как вариант можно так:

<input type='button' value='форма' class="mybutton">

и доступ к нему, такой:

$(".mybutton');

Webtest · #7 (**permalink**) 16.07.2014, 11:15

skrudjmakdak, а можно как-то сделать через кнопку? Потому что мне в кнопке надо передать инфу какой именно файл переименовать, в value="".

skrudjmakdak · #8 (**permalink**) 16.07.2014, 11:41

типо такого?

<html>
	<head>
		<title>example</title>
	</head>
	<body>
		<input type='button' value='форма' class="mybutton" namefile="myfile1.txt"><br>
		<input type='button' value='форма' class="mybutton" namefile="myfile2.txt"><br>
		<input type='button' value='форма' class="mybutton" namefile="myfile3.txt"><br>
		<input type='button' value='форма' class="mybutton" namefile="myfile4.txt"><br>
		<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
		<!--<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
		<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">-->
		<script>
			$('.mybutton').click(function ()
				{
				console.log($(this).attr('namefile'));
				})
		</script>
	</body>
</html>

Webtest · #9 (**permalink**) 16.07.2014, 12:08

skrudjmakdak, вообще вот такой код:
foreach ($scan as $key => $value) {
echo '<button name="openPic" value="' . $value . $key . '">' . $value . '</button>';
Сюда надо вставить кнопку, при нажатии на которую всплывала бы форма с текстовым полем и кнопкой ОКЕЙ, и если я что-то ввожу в форму и нажимаю окей, то менялось бы название кнопки 'openPic'.
}
Самое главное, чтобы в раскрывающейся форме текстовое поле было всязано с определенной кнопкой, чтобы не переименовывало все кнопки openPic.
Я это думла через button value='...' передать

skrudjmakdak · #10 (**permalink**) 16.07.2014, 12:18

Сообщение от Webtest

чтобы в раскрывающейся форме текстовое поле было всязано с определенной кнопкой, чтобы не переименовывало все кнопки openPic

ну так создай переменную, в которой будешь хранить указатель на нужную тебе кнопку:

<html>
	<head>
		<title>example</title>
	</head>
	<body>
		<input type='button' value='форма' class="mybutton" namefile="myfile1.txt"><br>
		<input type='button' value='форма' class="mybutton" namefile="myfile2.txt"><br>
		<input type='button' value='форма' class="mybutton" namefile="myfile3.txt"><br>
		<input type='button' value='форма' class="mybutton" namefile="myfile4.txt"><br>
		<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
		<!--<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
		<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">-->
		<script>
var savebutton;
			$('.mybutton').click(function ()
				{
				console.log($(this).attr('namefile'));
savebutton = $(this);
				})
		</script>
	</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript