html input send information to another website - html

I'm trying to send a string from an input box to Google's search input to search on my website.
The only way that I can think of is Posting it to my own page which then sends it to google.
Is there a way to cut out that middle page and go straight to google?
Summary: Send input box string to Google's input box and search using Google.
Current thoughts of how to do this are.
Make form with input box
Submit form to seperate page
Seperate page then redirects you to "https://www.google.com/#q=" $_POST['string'] "site:mysite.com"
But I feel like there's a better way to do this.
Thanks

<input type="text" class="foo">
<button onclick="send()">Submit</button>
<script type="text/javascript">
function send(){
var value = $('.foo').val();
window.location.href = "https://www.google.com/#q="+value+" site:mysite.com";
}
</script>

Related

Search Bar, Box

I am making some site for personal use.
I am trying to make some search bar, box.
But, all that I found is with PHP.
I do not want PHP search box,
I want something like Ctrl+G or Ctrl+H (Like "Find words in this site").
I want to make search bar for only text in active site,page.
Without PHP.
W3S is helping only with PHP.
If You know what I mean, please respond fast.
Sorry for my bad English. ;)
Thank You!
I tried search codes in Google and did not find how to make search box without PHP.
eg. CTRL+G or CTRL+H
I do not have code.
This is my first question on stackoverflow, sorry for mistakes..
I expect to work only in that site that is code in.(Again, sorry for English)
Any search box that you are creating to get data or information from your site will be using php because it is more then likely in most cases pulling data from your database if you are trying to replicate the default browser functionality for Ctrl+F then you can create a search box with html and JavaScript
Heres a little snippet to send you on the right path
jQuery(document).keydown(function(event) {
// If Control or Command key is pressed and the F key is pressed
if((event.ctrlKey || event.metaKey) && event.which == 70) {
// hide/unhide search box
//or put your custom code here
//Insert code above this line
event.preventDefault();
return false;
}
}
);
<form action="#">
<input type="text" id="search" placeholder="search">
<input type="submit">
</form>

Captcha Html Form

I followed Captcha's Tutorial and did this:
Paste this snippet before the closing </head> tag on your HTML template:
<script src='https://www.google.com/recaptcha/api.js'></script>
Paste this snippet at the end of the <form> where you want the reCAPTCHA widget to appear:
<div class="g-recaptcha" data-sitekey="key"></div>
I want to know how I can make a form to use the captcha in. I just want a basic form that you have to solve a captcha before you can see some text. So you solve the captcha and press the button and it shows some text like hidden message. I can't find this anywhere. Help me! I prefer plain html.
When your users submit the form where you integrated reCAPTCHA, you'll get as part of the payload a string with the name "g-recaptcha-response". In order to check whether Google has verified that user, send a POST request with these parameters
You need to send POST to URL https://www.google.com/recaptcha/api/siteverify with parameters what you see on your google reCAPTCHA account.
If you want BEFORE submitting form, add data-callback attribute to your g-recaptcha-tag. Inside that attribude set name of function that show hidden content only for successfully verifed users.
For more info check reCAPTCHA documentation.
Example
In your javascript define function to show hidden content:
function alertSuccess() {
$(".hidden.message").show();
//alert("Success");
}
In reCAPTCHA
<div data-callback="alertSuccess" class="g-recaptcha" data-sitekey="__YOUR_SECRET_KEY__"></div>

google apps script HTMLService button click opens new blank tab

Fairly new to HTML Service in apps script, have written a very basic UI.
The problem is that when the button is clicked (no onclick handler set) it opens up a new blank tab (I'm using Chrome).
Code below reproduces the behaviour, I have jquery / jquery UI references which are used in the broader project so left them in here.
How do I stop this blank tab opening on button click? Not shown here but it also happens when entered hit in a text box.
code.js:
function NewProposal() {
var html = HtmlService.createTemplateFromFile('Index');
var ss = SpreadsheetApp.getActiveSpreadsheet();
ss.show(html.evaluate().setHeight(530).setWidth(1100).setSandboxMode(HtmlService.SandboxMode.IFRAME));
}
Index.html:
<!DOCTYPE html>
<base target="_top">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/cupertino/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.4.1/jsgrid.min.js"></script>
<form>
<table>
<tr>
<td>
<button id="Create">Create</button>
</td>
</tr>
</table>
</form>
You'll need to either get rid of the button, and use something else, or get rid of the form tags, and use div tags. If you get rid of the form tags, then it's more difficult to collect data from any input tags in the form. But, I don't see any input tags in your form. If you have no input tags in your form, then using form tags is pointless. Maybe you just left them out for purposes of reproducing the error in as little code as possible.
When a button is clicked inside of a form tag, the default behavior is for the current window to issue a POST request. That refreshes the content in the browser, but if there is no callback to display some other content, the page will go blank.
The only way to avoid this built-in feature of a form with a button, is to not use a button, or not use the form tags.
A click event can be added to multiple different types of HTML elements. Like a link <a> tags. Or a <div>. So, you can use something else other than a button, style it to look like a button if you wish, and add a click event to whatever you decide to use.
If you have lots of different types of input tags, it may be better to continue to use the form. But if you can easily get all the data out of the table some other way, you don't really need the form. The form adds nothing to the capability of styling or layout. So, if the benefit of using the form doesn't fit your circumstance, then you can look at other options.
If you want to give feedback to the user about what inputs are required, that's another issue. The form tags, the required attribute, and the button submission are all part of a system to try to make form submission more automatic, and make data validation and data collection easier. But, in order to use that "built-in" functionality, it all needs to work together in a certain way. As with anything that people try to make generic, it's very difficult to make it fit all circumstances. If you don't want the page to go blank when the button is clicked, all of that built-in behavior can become more of a detriment than a help.
When Apps Script gets the form, it strips out most of the content from the form element, and creates an object of input names and their values. So, when the "form" object (No longer a real form object) gets to the server, the only way you can get the values out of the object is by using the name attributes.
Add onsubmit="return(false)" inside your form openning tag:
<form onsubmit="return(false)">
...
</form>

How to let a user browse for a url in an html form?

I am new to html and webdesign so please excuse any 'stupid' question ...
Similar to the <input type='file' ... field is there an easy way to let the user browse for an url of a webpage?
Currently I display a text field where the user has to enter or paste an url.
But it would maybe be nicer if he could browse the web inside a dialog and when hitting [OK] button the current url is copied automatically into the input field.
Is there any/Which way to go?
You should use a simple text input field.
Your client is already using a browser and can browse web in it, it is trivial for them to copy and paste the link from the navigation bar. It would severely hinder their experience if they had to use a custom-made browser inside a dialog.
This isn't possible with JavaScript for security issues. But there is a workaround if you must have this feature in your app, you'll need to mix flash and javascript together.
Here is an example of a working copy:
<script type="text/javascript" src="ZeroClipboard.js"></script>
<textarea name="box-content" id="box-content" rows="5" cols="70">
The David Walsh Blog is the best blog around! MooTools FTW!
</textarea>
<br /><br />
<p><input type="button" id="copy" name="copy" value="Copy to Clipboard" /></p>
The above HTML features a form element with the ID "box-content" and a button with the ID "copy". Both of those element IDs will come into play with ZeroClipboard.
The ZeroClipboard JavaScript
//set path
ZeroClipboard.setMoviePath('http://davidwalsh.name/demo/ZeroClipboard.swf');
//create client
var clip = new ZeroClipboard.Client();
//event
clip.addEventListener('mousedown',function() {
clip.setText(document.getElementById('box-content').value);
});
clip.addEventListener('complete',function(client,text) {
alert('copied: ' + text);
});
//glue it to the button
clip.glue('copy');

post html form fields to google map and get back result page

I'm not an expert but i know a little about HTML forms, here is my problem
i want to create a simple html page with form for my customers to enter a gps values to maps.google.com and get back the result page embedded in the same html
here is the exact format of my string
as an example : 32 06 12.66N, 20 12 22.65E notes that there is spaces between values
that should be post to ( maps.google.com/?q=32 06 12.66N, 20 12 22.65E ) and take the result page and embed it back in the same html page
i want to create a from with separated input fields for every value (drop down menu for the "N" "W" and "S" "E")
would you plz tell me what is exactly the html code for that , appreciate any help guys
You'll need to combine multiple elements into one form element. Use a hidden and some javascript to populate it before submitting.
Something along these lines
<form id="myForm" method="post" action="http://maps.google.com">
<input id="q" type="hidden" name="q" />
<!-- all your other inputs -->
</form>
Then some javascript:
<script type="text/javascript">
function Bind()
{
// bind FillQ to the submit event of the form
}
function FillQ()
{
var q = document.getElementById("q");
q.value = ... // the combination of your other form fields
}
Bind();
</script>
You need to do some scripting to achieve this. Either server side or client side. Consider either hiring someone out or doing some research and learning some coding. I'd recommend your local junior college, or a free online web programming course.
If you have a specific problem with your implementation, post your question here and we will be happy to help, don't expect us to do all the work for you though ;)
Here are some hints to get you started:
Use javascript to collect the drop down fields, and create the google maps url string.
You can search google maps developer site to find code on embending this into your page.