I have a <table> in a web page that I populate using JavaScript code like this:
var cellBarcode = row.insertCell(1);
var textNode = document.createTextNode(barcode);
cellBarcode.appendChild(textNode);
var cellItemName = row.insertCell(2);
var textNode = document.createTextNode(itemName);
cellItemName.appendChild(textNode);
I need to save its data to my database... So I need to know how I can submit it to php... Is it possible...? If yes, please provide some sample codes that are easy to understand for a beginner like me... thanks...
Yes, you can submit this information to a server-side script, but not without extra JavaScript code.
The extra JavaScript code would collect the information in the table (either from the DOM you've built, or by accessing the same data you used when building the table) into a string, which can then be sent to the server using one of standard ways.
Since you've used the term "submit", I'm assuming you want to send the table's data as part of an HTML <form> submission, you can put the generated string in an <input type="hidden"> element.
Related
I have a basic front-end form within a component that I created using ComponentCreator.
How and where do I direct the form "action"? Where can I handle this so that I am following the MVC design pattern? My form is within a view (default.php)
The form should simply insert to the database upon submission. I don't want to use a form building extension, I have tried these and they don't meet my requirements.
What version of Joomla? Assuming your not using AJAX then just direct to your controller.
<form id='MyForm' method='post' action='index.php?option=com_mycomponent&task=myoperation'>
<input type='text' name='myname'/>
...</form>
Then you will have a function in your controller (controller.php) called myoperation that will process all the things in your form (not forgetting the token of course)
JSession::checkToken('request') or jexit( JText::_( 'JINVALID_TOKEN' ) );
$jinput = JFactory::getApplication()->input;
$add_name = $jinput->get('myname', '', 'STRING');
//whatever you need to do...
//add to model if you wanted to add name to DB
$model = &$this->getModel();
$model->updateDB(...);
Then create function updateDB in model.
This is a rough example with Joomla 2.5 but should work with 3.x. Hope this helps.
Disclaimer- I AM A BEGINNER. If there is not a simple answer here, I will gladly review the correct tutorial, etc. But I've been looking for a couple days and I can't quite get this.
Use Case:
AS A: visitor viewing a Google Site
I WANT TO: fill out a form and select Submit
SO THAT: the information entered will populate an email and be sent to a specific address.
What I've done:
Created emailForm.html:
<html>
<body>
<script>google.script.run.processForm(document.getElementById('myForm'));
</script>
<div>
<form id='myForm'>
Subject:<input name='emailSubject' type='text'>
<br><br>
Body: <textarea name='emailBody' type='text'></textarea>
<br><br>
Add an Attachment: <input name='emailFile' type='file'>
<br>
<input type='button' value="Submit ZD Ticket" onclick='google.script.run.formSubmitReply()'>
</form>
</div>
</body>
</html>
Created sendEmail.gs: (NOTE: Script is incomplete. I have added my comments)
function doGet() { // This function creates the form on the google site for the customer to use
return HtmlService.createHtmlOutputFromFile('emailForm.html')
}
function formSubmitReply() { // This function is ran on the "Submit" button is selected and sends the email
var subject = // ?? HELP: In a perfect world, it would be as easy as HtmlOuput.getInput('emailSubject')
var body = // ?? HELP: In a perfect world, it would be as easy as HtmlOuput.getContent('emailBody')
var attachment = // ?? HELP: In a perfect world, it would be as easy as HtmlOuput.getContent('emailFile')
MailApp.sendEmail ('support#support.com', 'subject, body + attachment,
{name:'Support Request'});
}
My Assumptions:
I don't think I need to access any DB and I'm trying to avoid using a Google Spreadsheet. I just want to send the input values straight from the form to an email address.
I read one tutorial that suggested Logging the form values and then call that. But I don't know how to call the appropriate input from the form OR have those inputs added to the email. Sample function from Tutorial:
function processForm(theForm) {
Logger.log( // What goes here?
);
}
THANKS ALL for Any help!
You need to pass the form in to the call from your client code. You can retrieve the form using document.getElementById or simply make use of the fact that the parent of the button is the form, so you can reference it via this.parentNode. Try changing the html like this:
onclick='google.script.run.formSubmitReply( this.parentNode )'
Then in your server code you can use it all:
function formSubmitReply(theForm) {
var subject = theForm.emailSubject;
var body = theForm.emailBody;
var file = theForm.emailFile;
MailApp.sendEmail ('support#support.com', subject, body, {attachments: file});
}
When you have a form, the submission goes to a URL, so here is what you have to do
Modify the form code so that you
Write a doPost(e) method in your apps script code - this is where you will send out the email.
Publish your script as a web app and take the URL and replace the someURL in step 1 with the URL of the web app.
My questions is - how do I add a class or id to the body tag using a text field within Orchard?
So if I enter the word "product" in the text field then the result should be <body class="product">. I want to use this method instead of creating alternate layout templates as every page has the same layout but I need a different class for each page to reference a different colour scheme I have setup for each page in my CSS.
I have added a text field with the name Area to the Title ContentType in the backend. My problem is now how to get the value of the field to be put into the body in the Document.cshtml.
I have read Setting Unique Body Classes and IDs in Orchard and Using Alternatives for Document.cshtml in Orchard CMS but I still can't get it to work! The second one seems like what I want to do but so far I have been unable to acheive it.
Any answer would be very appreciated?
Thanks
Andy
I am so frustrated that there is no readily available solution found in the net about this. Since I am more comfortable coding in jquery & js...
Here's my solution: Assuming you have jquery loaded...
#using(Script.Foot()) {
<script type ="text/javascript">
//<![CDATA[
$(document).ready(function () {
var url = window.location.pathname;
var count = url.match(new RegExp("/", 'g'));
var urlsplit = url.split("/");
var page_class = urlsplit[count.length];
alert(page_class);
$('body').addClass(page_class);
});
//]]>
</script>
}
The easiest way to achieve this is to use the Classy feature from Vandelay.Industries.
I am using an application (a blog) written using the CodeIgniter framework and would like to search my blog from my browsers location bar by adding a string to the end of my blogs url like this:
http://mysite.com/blog/index.php/search...
As you can see in the example above I am not really sure how to format the rest of the url after the search part so I am hoping someone here might be able to point me in the right direction.
This is what the form looks like for the search box if that helps at all.
form class="searchform" action="http://mysite.com/blog/index.php/search" method="post">
<input id="searchtext" class="search_input" type="text" value="" name="searchtext">
<input type="submit" value="Search" name="Search">
</form>
Thx,
Mark
Since your form is posting to http://mysite.com/blog/index.php/search, I'm assuming this 'search' controller's default function is the one your are attempting to submit your data to. I think that the easiest way to do this would be to just grab the post data inside of the controller method you're posting to. Example:
function search()
{
$search_params = $this->input->post('search_text');
}
Then you would have whatever the user input stored as $search_params, and you can take actions from there. Am I misunderstanding what you're asking?
It seems like you're kind of discussing two different approaches. If you wanted to make a request to
mysite.com/blog/index.php/search&q=what_I_am_looking_for
This is going to call the search controllers default method (which is index by default). If you wanted to use the URL to pass parameters like that you would go to your function in the search controller and do:
print_r($this->input->get('q'));
This will print out "what_am_I_looking_for".
An easier approach in my opinion would be to:
1. Create a view called "search_view" with the HTML content you pasted above, and have the form "action" http://www.mysite.com/blog/index.php/test/search
Create a controller called "Test" that looks like the following:
class Test extends CI_Controller {
function search()
{
$search = $this->input->post('searchtext');
print_r($search);
}
public function display_search()
{
$this->load->view('search_view');
}
}
Visit http://www.mysite.com/blog/index.php/test/display_search in your browser. This should present you with the form you placed in search_view.php. Once the form is submitted, you should be sent to the search function and print out the variable $search, which will have whatever text you submitted on that form.
If this isn't what you were looking for then I am afraid I do not understand your question.
I wanted to find a way to upload a single file*, in the background, have it start automatically after file selection, and not require a flash uploader, so I am trying to use two great mechanisms (jQuery.Form and JQuery MultiFile) together. I haven't succeeded, but I'm pretty sure it's because I'm missing something fundamental.
Just using MultiFile, I define the form as follows...
<form id="photoForm" action="image.php" method="post" enctype="multipart/form-data">
The file input button is defined as...
<input id="photoButton" "name="sourceFile" class="photoButton max-1 accept-jpg" type="file">
And the Javascript is...
$('#photoButton').MultiFile({
afterFileSelect: function(){
document.getElementById("photoForm").submit();
}
});
This works perfectly. As soon as the user selects a single file, MultiFile submits the form to the server.
If instead of using MultiFile, as shown above, let's say I include a Submit button along with the JQuery Form plugin defined as follows...
var options = {
success: respondToUpload
};
$('#photoForm').ajaxForm(options);
... this also works perfectly. When the Submit button is clicked, the form is uploaded in the background.
What I don't know how to do is get these two to work together. If I use Javascript to submit the form (as shown in the MultiFile example above), the form is submitted but the JQuery.Form function is not called, so the form does not get submitted in the background.
I thought that maybe I needed to change the form registration as follows...
$('#photoForm').submit(function() {
$('#photoForm').ajaxForm(options);
});
...but that didn't solve the problem. The same is true when I tried .ajaxSubmit instead of .ajaxForm.
What am I missing?
BTW: I know it might sound strange to use MultiFile for single-file uploads, but the idea is that the number of files will be dynamic based on the user's account. So, I'm starting with one but the number changes depending on conditions.
The answer turns out to be embarrassingly simple.
Instead of programmatically submitting using...
document.getElementById("photoForm").submit();
... I used...
$("#photoForm").submit();
Also, since I only need to upload multiple files on occasion, I used a simpler technique...
1) The form is the same as my original...
<form id="photoForm" action="image.php" method="post" enctype="multipart/form-data">
2) The file input field is basically the same...
<input id="photoFile" "name="sourceFile" style="cursor:pointer;" type="file">
3) If the file input field changes, submit is executed...
$("#photoFile").change(function() {
$("#photoForm").submit();
});
4) The AjaxForm listener does its thing...
var options = {
success: respondToUpload
};
$('#photoForm').ajaxForm(options);