I newbie in drupal 7. I am writing new theme and I don't know how to add my class to form in drupal 7. I install ubercart to setup e-commerce website. I added new attribute for product (Size). I want to redesign in product page. In this page, It has size field but I don't know how to add my CSS. E.g:
<form action="/drupal-7.34/node/6" method="post" id="uc-product-add-to-cart-form-6" accept-charset="UTF-8"><div><div id="uc_product_add_to_cart_form-6-attributes" class="attributes"><div class="attribute attribute-1 odd"><div class="form-item form-type-select form-item-attributes-1">
<label for="edit-attributes-1">Size <span class="form-required" title="This field is required.">*</span></label>
<select id="edit-attributes-1" name="attributes[1]" class="form-select required"><option value="" selected="selected">- Select -</option><option value="1">39</option><option value="2">40</option><option value="3">41</option></select>
</div>
</div></div><input type="hidden" name="qty" value="1">
<input type="hidden" name="form_build_id" value="form-w06CKx7aNBiYShqfg8LiP98CaFLpEb8mgWzFYQWqnQ4">
<input type="hidden" name="form_token" value="JtZIrcKeIfXiVpwX43K6KqHPlZazR1klS1ht3W7PI9I">
<input type="hidden" name="form_id" value="uc_product_add_to_cart_form_6">
<div class="form-actions form-wrapper" id="edit-actions"><input class="node-add-to-cart form-submit" type="submit" id="edit-submit-6" name="op" value="Add to cart"></div></div></form>
I want to add my class to the select element. How can I do that?
In your theme directory there is file named theme_name.info . Inside of it there should be (or you can create it) array that defines css file which will be included on page. Check out explanation here:
https://www.drupal.org/node/171205
https://www.drupal.org/node/171209
So, you basically have to add path of your css file to that list and it will be included on every site page. Your html.php template must print out stylesheets variable (which will contain paths to css files). If you are not sure how to do it check how it's done on some standard drupal theme that comes with drupal installation.
After adding your css to theme info file don't forget to clear the cache!
Other way would be to include it manually, from page.tpl.php file. Just add there common CSS include line, like you would that in plain HTML file.
You can add CSS even from code with drupal_add_css() function, but that's a bit more advanced.
And you can use form id attribute to "aim" it and all inner elements with css.
Related
I made a custom label element with a for attribute attached to a file input element, and put it in the Form tab :
<label for="file-upload" class="label-file-upload">Choose a file</label>
<input id="file-upload" type="file">
I can upload a file but I don't know which mail-tag I have to put in the Mail tab in order to send it. I tried this :
[file-upload]
But it of course doesn't work. I suppose I have to add a form-tag in my code but I don't know how..
Any ideas ?
I ve found a solution:
<label for="file-upload" class="label-file-upload">Choose a file</label>
[file file-upload class:file-upload id:file-upload limit:2mb filetypes:jpg|zip|rar|doc|pdf|xls|docx|xlsx]
Mail-tag:
[file-upload]
I'm trying to duplicate the search box on this site : https:clearviewlibrary.org over on a Wordpress install here: https://news.clearviewlibrary.org
I was able to get the search box to execute a search on the external site with this code:
<div>
<form method="get" action="javascript:void(0)"
onsubmit="window.open('http://www.wsld.info/#section=search&term<%=Config%>#section=search&term='+this.term.value+'', '_blank');return true;">
<label>
<input type="text" class="searchform" name="term" placeholder="Search Our Catalog" /></label>
</form>
</div>
but I'm stumped on how to go about adding the additional search functionality and radio buttons.
I've tried taking the code from the clearviewlibrary.org site, but that didn't work. I also saw this, but would rather not have the two buttons : HTML form action search, one text box, 2 buttons, 2 possible results
Thanks,
Brad
I have created form using twig template, the form has first name,last name and email.I need to save those values to database.
how can I create new table and store data in it??
<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
First name: <input type="text" name="FirstName"><br>
Last name: <input type="text" name="LastName"><br>
Email: <input type="text" name="email" value="Mouse"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Can anyone help on that please??
You should use drupal's form api to create the form. Your way is not really "drupalish" way. Then you can define custom content type, with all the fields you need and if form submission handler of your form you can create new nodes in that type with data your form collected.
So google a bit, check some tutorial on form api, and how to make custome form and also on custom content types in drupal. Not that scare as it maybe looks to you right now.
Or, check on webform module that comes with D8 default installation, maybe you can use it instead!
I have a simple form on my main page. It needs to be toggle-able (is that a word?) between the simple version and the detailed version using a button. Where do I put the code for the button, inside or outside the form element? I read online that the submit button should be within the form, so I'm guessing a toggle button should also be there? But I'd rather ask more experienced people. Also, how would I make the forms retain the same content that the user typed when toggleing?
This is for a form I'm making on Wordpress.
I would recommend placing the toggle button outside of the <form> element and then use jQuery (or plain javascript) to handle the switching between the simple and detailed versions of the form. I'm not exactly clear what you had in mind for the simple and detailed versions of the form, but this approach should be easy to adapt to your purposes.
You can give the advanced form fields the same class (e.g. "detailed"), have them hidden by default in your CSS, and then have them appear when the toggle button is clicked using jQuery.
The values inputted into the detailed form fields won't get lost when the button is toggled; the values are still there, but just hidden. They'd still get submitted when the form submit button was clicked.
This is the toggle and <form> code.
<button id="form-toggle">Toggle Detailed Form Fields</button>
<form id="test-form" action="action_page.php">
<p>First name: <input type="text" name="firstname" value=""></p>
<p>Last name: <input type="text" name="lastname" value=""></p>
<p class="detailed">Email: <input type="email" name="email" value=""></p>
<p class="detailed">Phone: <input type="tel" name="phone" value=""></p>
<p><input type="submit" value="Submit"></p>
</form>
This is the CSS you should place in your stylesheet, it makes the detailed form fields hidden by default:
.detailed {
display: none;
}
This is the jQuery code that you could enqueue as an external .js file in your functions.php file or before the </body> of your footer.php file:
<script type="text/javascript">
jQuery(document).ready(function($){
$('#form-toggle').click(function() {
$('.detailed').toggle('fast');
});
});
</script>
I have a privatemsg module in Drupal 7, which uses autocomplete in field "To" (Do is polish translation). It looks very unattractive and I see no option to customise it unfortunately! I checked the code and I tried to modify it, but it doesn't work :o
<input type="text" id="edit-recipient" name="recipient" value="" size="50" maxlength="128" class="form-text required form-autocomplete" />
<input type="hidden" id="edit-recipient-autocomplete" value="http://niemiecki.dogadajsie.pl/messages/autocomplete" disabled="disabled" class="autocomplete" />
As we can see the autocomplete has id="edit-recipient-autocomplete" and class="autocomplete". When I modify it, it just doesn't work in any way. When I tried to search for reference to this id or class I found nothing. Can somebody tell me how to customise it?
Actually it looks like this:
http://i.stack.imgur.com/r6Gej.png
Kind regards, Michael.
What you are trying to modify with the field? You can use hook_form_alter to modify the field. The auto complete class is added because its explicitly set for auto complete.