I have a form field in Drupal which I need some help with.
The requirement is to have the field show up as a simple input field, but to have a toggle button against it which would convert it into a multi-line text box for users who wish to enter more data.
In traditional PHP/HTML/Javascript this would be dead easy -- two fields; one styled with visibility:hidden; and a short js function on a button to toggle the visibility style of the two fields.
But I can't see how to translate this concept into the Drupal forms API. Can anyone help?
I'm experienced with PHP but an absolute beginner with Drupal, by the way. I'm still feeling my way around it, so please bear with me if I've asked something really obvious.
I solved this one myself. Now that I know Drupal a bit better, it's actually pretty simple (I can see why no-one bothered to answer). In the end I was able to use a pretty similar technique to the traditional methods I mentioned in the question.
Related
Two really good bits of UI for Bootstrap 3.
Firstly, to validate field forms, the validation found here - http://bootstrapvalidator.com/
Secondly, the default style of the select element isn't great, I've used various methods in the past to style the select, however, usually come across browser render issues - this plugin works great with bootstrap - http://silviomoreto.github.io/bootstrap-select/
So I was quite happy with the above... until I tried using them together. The validation won't work (green tick fails to appear) when using the selectpicker to style the select.
Can these work in sync, if so, how!?
Have you had a look at the documentation for the Bootstrap validator? It mentions the Bootstrap Select plugin:
http://formvalidation.io/examples/bootstrap-select/
It seems to suggest they work together. If you're still having problems, it might be worth posting your code or a Bootply.
Edit: Sorry, I've just realised how old this post is (I found it on the newest questions bit, so didn't check), so I imagine it wasn't in the documentation then! I'll leave my answer anyway, just in case anyone stumbles across it asking the same question.
I want to create a html site for troubleshooting problems, in which the user selects an answer to a question and then another question is loaded based on the answer, and then another question based on that answer and so on until they drill down to a solution.
I've looked around on here for something similar but all I've found so far is quite simple code that hides all divs then changes the display options based on which radio button is selected - with the number of questions I want to load I dont think this would be suitable...
I think the best way to do it would be to find a way to store all of the different questions in a separate file then use an onclick event to load the correct one depending on which radio button is selected... preferably using AJAX. Problem is I'm extremely rusty with my js/ajax and have no idea where to begin with this!
I realise it sounds like I'm asking practically asking someone to write it for me haha! but even if someone knows of any tutorials or can just point me in the right direction it would be greatly appreciated!
Try JQuery-Drilldown
A Demo and Instructions are in the Link below. Just look at the tags and the JavaScript
I'm trying to accomplish something that might be relatively simple, but I don't know what I would call it (if there is a specific name for it), hence my searches have proved useless.
What I'm trying to accomplish is simple: I have a page built off off the Masonry jquery plugin (similar to http://designshack.net/tutorialexamples/masonry/demos/masonry.html). All I want to do is that when I click on a specific picture, it creates a "box" that fills up part of the screen and can contain another webpage (to describe the picture) while fading out most of the background. Then when I click outside of the box, it returns to all of my pictures.
I've seen this before, as I'm sure everybody else has, but for the life of me I cannot remember an example to look at or how best to do this. I don't have too much experience with javascript or jquery (which is why I'm asking this), but any help to point me in the right direction, whether it is using javascript or html/css, would be great.
If anybody does get the gist of what I'm describing and can explain it better, then you're more than welcome to edit..
What you need are modal windows.
I know the twitter bootstrap has built a pretty good framework for this:
http://getbootstrap.com/javascript/#modals
If you aren't using the bootstrap directly you might be able to pick out what you need.
I am a beginner in HTML5, CSS3, and JavaScript. I reached my limit for the use of the trial version of Microsoft's OneNote. I like the program so much, I want to make an equivalent of it as an html version so I won't have to empty my pockets for the paid version.
The part I need help with is the part where you type in your notes. I don't know how to make a text edit field in html. Is it possible to do something like that? I would be satisfied if it could only do the same functions as note pad. Just so long as I am able to do the simple type and edit functions. Can someone show me how to code this or lead me to a site that teaches something like this?
Thanks! Tony.
There are plenty of solutions out there. Nicedit, CKEditor, etc. These all have a Rich text interface, and are javascript managed.
The simplest solution would be to just use a <textarea> which would allow for plain text input only.
The simplest way is to use the <textarea> tag in HTML. See this link too.
You can also use HTML5 Data caching to save your notes locally through your browser after implementing your textarea tags.
Here's a neat little plugin that should be relatively minor to install/use.
https://github.com/ekdevdes/storage.js
I am trying to build a little test shell for my website using Javascript. What I have at the moment is a normal website. PHP/HTML with an SQL backend.
What I'd like is a simple Javascript feature whereby the user has a single slider object and can use this object to set the upper and lower limit on a number of variables, which will be determined by a drop down box just underneath the slider.
Aside from this, I'd just like a number of checkboxes which dictate which products are displayed (i.e if I'd like food but not drink, the food checkbox would be ticked!).
I'm not expecting anyone on SO to do this for me, of course, but I would like to find some specific areas I could go to learn how to do this, and google is failing me in this regard. I will then begin working/editing this post to show my code/ask for help.
Can anyone help please?
It seems that you want to build a specific search for site, but instead of the user searching it is what is displayed. I would start with looking at php, based upon which checkboxes they choose, you can return variables which would show them what they want to see.
I personally wouldn't use javascipt for this.
I'm not sure what your level of experience is with Javascript, so my apologies if this answer is too basic.
To put a slider on your page refer here for the HTML:
http://webhole.net/2010/04/24/html-5-slider-input-tutorial/
Then in Javascript get the value of that slider when making your GET requests of the server.
You can store the selected value or checked value in the target element, when you process, you just call the element and get the value from them. Using jquery data() method can store the value to element and retrive it pretty easy.
If you still have no clue, I redcomend you learn some basic javscript techniques, go to this site www.jquery.com .
Are you using jQuery and jQuery UI? jQuery UI has a nice slider widget with a number of configuration options and good documentation: http://jqueryui.com/demos/slider/
If you're not used to it, there may be a bit of a learning curve for jQuery, but it makes a great number of UI features much, much easier to code. Showing and hiding elements based on checkboxes, for example, is a pain to do in straight JS but fairly simple to do with jQuery. There are lots of other ways to just make a slider, but if you're planning to do much more with the UI I'd strongly recommend using a library like jQuery to do the heavy lifting.