To start with: My web coding skills are nearly to non existent, I just did a bit of HTML ages ago...
And my first steps with php are just made today.
My goal is: Having a color picker and sending the picked value as an argument to an python script.
I managed to use the jscolor picker libary (http://jscolor.com/examples/) and I've been also able to run the python scripts with an (color) argument from php.
My problem is now:
How do I submit the color string (hex-str) to the exec command (LED_color)?
<?php
$LED_color="FFFFFF";
$LED_color=escapeshellarg($LED_color);
if (isset($_POST['button']))
{
$LED_color = $_REQUEST['hex-str'];
echo shell_exec("sudo /home/pi/LEDscripts/color-by-arg.py $LED_color");
}
?>
<html>
<head>
<title>Basic usage</title>
</head>
<body>
<div style="position:absolute; left:280px; top:10px;">
toString = <span id="hex-str"></span><br />
</div>
<script src="jscolor.js"></script>
Color: <input class="jscolor {closable:true,closeText:'Close me!',onFineChange:'update(this)'}" value="000000">
<script>
function update(picker) {
document.getElementById('hex-str').innerHTML = picker.toString();
}
</script>
<form method="post">
<p>
<button name="button">Submit color</button>
</p>
</form>
</body>
</html>
Your color picker input needs a name attribute to match your PHP code, and also needs to be inside the <form> element.
<?php
if (!empty($_POST["hex-str"])) {
$LED_color = escapeshellarg($_POST["hex-str"]);
echo shell_exec("sudo /home/pi/LEDscripts/color-by-arg.py $LED_color");
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Basic usage</title>
<script src="jscolor.js"></script>
</head>
<body>
<form method="post">
<p>
Color:
<input type="text" name="hex-str" value="000000" class="jscolor" data-jscolor="{closable:true,closeText:'Close me!',onFineChange:'update(this)'}"/>
toString = <span id="hex-str-display"></span>
</p>
<p>
<button type="submit">Submit color</button>
</p>
</form>
<script>
function update(picker) {
document.getElementById('hex-str-display').innerHTML = picker.toString();
}
</script>
</body>
</html>
Related
Say I have a page with a textarea which acts as an input.
Then I have a Submit button and right under everything i have the
output textarea.
Now what I want to do is when the input has been submitted and
sent into the output text area, how can I then retrieve the text from the output area.
This is the code i have:
<head>
<?php error_reporting(0);
$OutputText = $_GET['OutputText'];
?>
</head>
<body>
<form action="#" method="_GET">
<textarea name="InputText">
hi
</textarea>
<input type="submit" name="submitFirstInput">
</form>
<textarea name="OutputText">
<?php echo $_GET['InputText']; ?>
</textarea>
<hr>
<p>Output String Length: <?php echo strlen($OutputText); ?> </p>
</body>
for reasons I dont understand, it cant define the $OutputText,
Do they both have to be in a form? As i have understood form's is only to send data, and testing it didn't help much either.
Keep in mind this is just a barebones version of the original, essentially i have some Input text and then through some logic it gets modified, therefor i want some statistics for the output result. So just getting the first input isnt rather useful..
adding some javascript you can sync the two textarea:
<!DOCTYPE html>
<html lang="">
<head>
<title></title>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(window).load(function(){
$("#one, #two").on("change keyup", function(){
$("textarea").not($(this)).val($(this).val());
});
});
</script>
</head>
<body>
<form action="#" method="GET">
<textarea name="InputText" id="one"></textarea>
<textarea name="OutputText" id="two"></textarea>
<input type="submit" name="submitFirstInput">
</form>
<hr>
<?php echo '<pre>'; var_dump($_GET); echo '</pre>'; ?>
<p>Output String Length:
<?php echo strlen($_GET['OutputText']); ?> </p>
</body>
</html>
Textarea must be inside the form tag, and the method must be GET (or POST)
try this:
<!DOCTYPE html>
<html lang="">
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<form action="#" method="GET">
<textarea name="InputText">hi</textarea>
<input type="submit" name="submitFirstInput">
<textarea name="OutputText"><?php echo $_GET['InputText']; ?></textarea>
</form>
<hr>
<?php //echo '<pre>'; var_dump($_GET); echo '</pre>'; ?>
<p>Output String Length: <?php echo strlen($_GET['OutputText']); ?> </p>
</body>
</html>
Scenario:
I am trying to have a part of my page constently run a function, the function is then affected when the above buttons are clicked.
The buttons call functions that are within the main/constant function; master($selected).
Here is what i have tried.
index.php:
<? session_start();
require("inc.ini.php");
?>
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<meta charset="utf-8">
<title>Buttons to funtions</title>
</head>
<body>
<main>
<header>
<form method="post" action="<?=$_SERVER['php_self']?>">
<button type="submit" name="change" value="insert, <?$selected = "func1";?>">Func 1</button>
<button type="submit" name="change" value="insert, <?$selected = "func2";?>">Func 2</button>
</form>
<!--
I want to press a button and when it is pressed it calls the function selected and gives it the value of which the button represents.
-->
</header>
<figure>
<?
if($_POST['change']){
echo $selected;
master($selected);
}
?>
</figure>
</main>
</body>
</html>
inc.ini.php:
<? session_start();
function master($selected){
if($selected == "func1"){
function func1(){
echo "func 1";
}
}
if($selected == "func2"){
function func2(){
echo "func 2";
}
}
}
?>
Another side question. do i need to do these if statements, can the $selector jump straight to the new function.
Php is a server side language, this means that a request needs to be sent to the server to make your code run.
Also when a form submits all of it's children are sent, so it is not possible to distinguish which has been clicked.
That being said:
<?php
session_start();
require("inc.ini.php");
?>
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<meta charset="utf-8">
<title>Buttons to funtions</title>
</head>
<body>
<main>
<header>
<form method="post" action="<?=$_SERVER['php_self']?>">
<button type="submit" name="change" value="Func1">Func 1</button>
</form>
<form method="post" action="<?=$_SERVER['php_self']?>">
<button type="submit" name="change" value="Func2">Func 2</button>
</form>
</header>
<figure>
<?php
if (isset($_POST['change'])) {
echo $_POST['change'];
master($_POST['change']);
}
?>
</figure>
</main>
</body>
</html>
If you use 2 forms then you get different values for the same name.
Looking at your inc.ini.php file it seems you're defining functions based on which input has been entered. I would suggest not doing this but if your heart is set on it then okay.
Please add a comment to this post if you need more help.
Hope this helps.
I have simple php/ajax/mysql chat. But unfortunately when I am sending form into database, php send off empty string to MySQL, how can I fix it ?
Here page.php code, with script:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#messages").load('ajaxLoad.php');
$("#userArea").submit(function(){
$.post('ajaxPost.php', $('#userArea').serialize(), function(data){
$("#messages").append('<div>'+data+'</div>');
});
return false;
});
});
</script>
</head>
<body>
<div class="container">
<div id="messages"></div>
<form method="post" action="ajaxPost.php" id="userArea" style="margin: 0 auto; font-size: 23px; text-align: center;">
<h1>Chat</h1>
<input type="text" name="message" />
<input type="submit" value="send!" />
</form>
</div>
<?php include_once('ajaxLoad.php'); ?>
<?php include_once('ajaxPost.php'); ?>
And ajaxPost.php:
<?php
include_once('page.php');
include('config.php');
$message = $_POST['message'];
$db->Query("INSERT INTO messages(message1) VALUES ('$message')");
echo $message;
?>
If you run: alert($('#userArea').serialize()) it will show you your message.
Get rid of these lines:
<?php include_once('ajaxLoad.php'); ?>
<?php include_once('ajaxPost.php'); ?>
These scripts are only supposed to be used from AJAX, you shouldn't execute them when just displaying the original form. When you execute them with include() there's nothing in $_POST, so you insert an empty message.
You haven't shown what's in ajaxLoad.php, but from the way you use it with $("#messages").load(), I doubt that it should be run with include.
I'm pretty sure that ajaxPost.php works correctly when you call it with $.post(), and the empty rows are coming from the include_once().
I don't think it should prevent the insert, but you also shouldn't have
include_once('page.php');
in ajaxPost.php.
I am a complete beginner in PHP.
I am trying to create a HTML/ PHP Script that will use the user input from an HTML form and than use php shell_exec to search for files with that input using the "find /var/www -Name " command.
I know how ro run a simple script with PHP, but I have no idea how do do that with user Input...
Eg: "
<?php
if (isset($_POST['button']))
{
exec('test.sh');
}
?>
<html>
<body>
<form method="post">
<p>
<button name="button">Run Script</button>
</p>
</form>
</body>
"
This is how far I've got. I've decided two make to files, one HTML, the second one the PHP script:
search.html
<html>
<body>
<form action="search.php" method="post">
keyword: <input type="text" name="keyword"><br>
<input type="submit">
</form>
</body>
</html>
php script:
search.php
<html>
<body>
<?php shell_exec('find /var/www -Name "keyword"') $_POST["keyword"]; ?>
</body>
</html>
This should do the trick :
<?php
$keywords=$_POST["keyword"];
$result=shell_exec('find /var/www -Name "'.$keywords.'"');
echo '<pre>'.$result.'</pre>';
?>
BEWARE: it is a bad idea to use such a command, because you are using user input directly, user can run any kind of command on the server.
For example, if a user type "; rm -rf /var/www;echo " as search, it will delete the whole content of your /var/www folder.
You'd better implement a php function that will do the same thing as your find command.
However, you MUST ALWAYS do sanitize any user input, everything that comes from the outside world is evil..
Got it:
<?php
$keyword=$_POST["keyword"];
$result=shell_exec(' find /var/www -name '.$keyword.'');
if (!isset($_POST['submit'])) { // if page is not submitted to itself echo the form
?>
<html>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="jumbotron">
<h1>Search</h1>
</div>
<div class="row">
<div class="col-md-4">
<title>Search</title>
</head>
<body>
<form method="post" action="<?php echo $PHP_SELF;?>">
Suchen:<input type="text" size="12" maxlength="500" name="keyword"><br />
<input type="submit" value="submit" name="submit">
</form>
<?
} else {
echo " ".$result."<br />";
I have an html page which contains a div that displays the html from an external php file.
It works great until I add a DOCTYPE declaration to the html page. The page continues to function, except the external content does not appear in the div.
<!DOCTYPE HTML>
<html dir="ltr" lang="en-US">
<head>
<title>Test Page</title>
<!--meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"-->
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript" src="./inc/jquery.js"></script>
<script type="text/javascript">
function getinfo()
{
$.post('prodinfo.php', { prodcode: prodcodeform.prodcodevar.value},
function(output)
{
$('#prodinfo').html(output).show;
});
}
function hideinfo()
{
$('#prodload').hide();
$('#openprodinfo').show();
}
function showinfo()
{
$('#prodload').show();
$('#openprodinfo').hide();
}
</script>
</head>
<body>
<input style="position:relative;" type="button" class="button" id="openprodinfo" title="Open" value="INFO" onclick="showinfo();">
<DIV id="prodload" style="position:absolute;margin-left:auto;margin-right:auto;display:none;text-align:center;background-color:#000000;z-index:200;border:1px solid #4e443b;">
<div id="prodinfo" style="position:relative;display:block;top:0;width:1000px;height:820px;background-color:#ffffff;margin-left:auto;margin-right:auto;">
</div>
<form name="prodcodeform">
<input type="text" readonly="readonly" id="prodcodevar" name="prodcodevar" value="nil" >
</form>
<div ID="prodinfobutton" style="position:relative;">
<input style="position:relative;" type="button" class="button" id="closeprodinfo" title="Close" value="CLOSE" onclick="document.getElementById('prodcodevar').value='nil'; hideinfo(); ">
</div>
<input type="button" id="button001" value="ONE" onclick="document.getElementById('prodcodevar').value='item1'; getinfo();">
<input type="button" id="button002" value="TWO" onclick="document.getElementById('prodcodevar').value='item2'; getinfo();">
</DIV>
</body>
</html>
You are switching to Standards mode, so your browser is no longer playing the game of being compatible with Internet Explorer 4.
prodcodeform.prodcodevar.value will error because prodcodeform is undefined.
You don't get a global variable for every element with an id or name in a document.
Change:
<form name="prodcodeform">
To
<form id="prodcodeform" method="post" action="prodinfo.php">
… and make it do something sane when a non-Ajax request gets posted (move it so it is around the buttons, make them submit buttons, and cancel the default event if the JS succeeds).
Then add:
var prodcodeform = document.getElementById('prodcodeform');
before you try to use the variable.
You started your body with </body> instead of <body>.