We Keep Coding

How to submit custom input field data

I am creating custom input field in html.Now i am facing problem how to submit data by using these custom fields. Custom field may be a radio option, may be it a select option, text field etc etc using can write name of that field by his own choice i want to know how to submit data of that fields in php and jquery.
<div id="custom fields">
//custom fields data
</div>
Is there any way to submit whole div fields with value ..If i write name in input text field and submit then my complete input filed and its value will save in database? when i retrieve these fields it will show input with value?

If you want to fetch multiple values than take a form else go for jQuery selector.
For multiple values (includes every types of DOM elements)
HTML :- <form id="formID"> ...... </form>
Access the form elements by using jQuery serialize function
NOTE :- serializeArray creates an array (not a "json array" -- there is no such thing); you can test this yourself with console.log($("#formID").serializeArray()). On the other hand, serialize creates a query string that's meant to be part of an HTTP request. Both representations are equivalent in the sense that using appropriate code you can convert one to the other without any ambiguity.
Example :- $("#formID").serialize(); OR $("#formID").serializeArray();
For single value
HTML :- <input id="name">
Javascript :- document.getElementById("name");
jQuery :- $("#name").val();

<div id="customfields">
//custom fields data
</div>
<script type="text/javascript">
setInterval(function () {
document.getElementById("customfields").value = document.getElementById("customfields").innerHTML;
}, 5);
</script>

You cannot submit fields in between div tag. Please use form tag to submit fields.
<form></form>

Are you find this?
$( "form" ).serialize()

Is it possible to change HTML "value" for a django rendered form field?

Basically, I have a form with a radio select widget for a field called Queue. Queue has 4 choices, which are coming from a model, accessed and set via views.py. I am rendering this form on my template by doing {{form.queue.0}}, {{form.queue.1}} and so on.
For example, {{form.queue.3}} gives me:
<input id="id_queue_3" name="queue" value="2" type="radio">
As you can see, there is a value and field index mismatch - queue.3 is showing up as value="2" and this is messing with some JS that uses the value to open the right subset of menus under each radio button.
Is it possible for me to render the radio field on the template by manually specifying the value?
My forms.py:
class PublicTicketForm():
queue = forms.ChoiceField(
widget=forms.RadioSelect(),
label=_('What do you need help with?'),
required=True,
choices=()
)
My views.py for this form:
form = PublicTicketForm(initial=initial_data)
form.fields['queue'].choices = [('', 'Other')] + [
(q.id, q.title) for q in Queue.objects.filter(allow_public_submission=True)]

Try the following in your code:
form = PublicTicketForm(initial=initial_data)
form.fields['queue'].choices = [('', 'Other')] + [
((int(q.id)+1), q.title) for q in Queue.objects.filter(allow_public_submission=True)]
Note: I assumed that you wanted a constant change(increment of 1) in the value attribute of your <input> tag.
For example:
<input id="id_queue_3" name="queue" value="2" type="radio">
<input id="id_queue_4" name="queue" value="3" type="radio">
becomes
<input id="id_queue_3" name="queue" value="3" type="radio">
<input id="id_queue_4" name="queue" value="4" type="radio">
To elaborate this: in the code snippet:
queue = forms.ChoiceField(
widget=forms.RadioSelect(),
label=_('What do you need help with?'),
required=True,
choices=()
)
the attribute choices takes a simple tuple structured like:
(('I_become_the_value_1' , 'I_appear_on_browser_screen_1'),
('I_become_the_value_2' , 'I_appear_on_browser_screen_2'),
#and so on...
)
So when you are supplying the pk(q.id is the pk value of a model) as the first index of the tuple, the pk value actually becomes the value attribute in <input> tag.
Note: You should always know that this value attribute in <input> tag in the backbone structure of the ChoiceField in Django. It helps in mapping what value was selected by the user.
Lastly, make sure that you successfully retrieve the exact value selected by the user when the form is submitted by cross-checking them. You might need a tweak there as well. There is a possibility that choices selected by the user in the browser aren't received correctly inside your view.(pk values might get mixed up)
EDIT: As asked, I too feel that using increments in pk is not a very good solution. To avoid this, you can declare your own primary key field through UUIDField. Read about it here. This will allow you to get a large string(unique) in the value attribute of <input> tag. Use it like:
Inside your models.py:
class Queue(models.Model):
#all your fields.
alternative_unique_id = models.UUIDField(default=uuid.uuid4, editable=False, unique=True)
#Rest of the code.
Now you can query it in the same way but add alternative_unique_field as the first index of the tuple.
in your views.py
form = PublicTicketForm(initial=initial_data)
form.fields['queue'].choices = [('', 'Other')] + [
(q.alternative_unique_id, q.title) for q in Queue.objects.filter(allow_public_submission=True)]
Also, you can declare this alternative_unique_id as a primary key as well.
That will save some space in the database.
Second Approach: instead of using a UUIDField, you could create your own primary key field by simply setting primary_key=True inside the field. You can do it like:
name = models.CharField(primary_key = True , max_length = 64)
But make sure it's always going to be unique and change some logic in your form.fields['queue'].choices to get a suitable value inside the value attribute of the <input> tag.
Hope this helps you. Thanks.

Create dynamic HTML form using javascript

I've been googling and googling but completely stuck on this.
I have a GET request that retrieves some JSON containing a list of users. However the list of users changes.
I want to generate a simple HTML form that contains the names of the users, and then an input field so that they can be given a rating. I then need to gather the ratings and send a POST request in JSON.
What would be the best way to approach this? I was thinking of looping through the users and just displaying them with a text input type but then I have no idea how I can use the form data to send the POST request!
Any help would be greatly appreciated

Populate UI base on JSON
HTML:
<form id="user_list">
<div>
</div>
<input type="submit"/>
</form>
JS:
var obj = {
users:[{name:"user 1"},{name:"user 2"}]
}
var user_list = $("#user_list>div");
obj.users.forEach(function(user,index){
user_list.append("<div>"+
"<h1>" + user.name + "</h1>"+
"<input type='text' id='user_"+ index +"'/>"+
"</div>");
});
Send selected values to server.
Option 1
If you make this page full post back when click on submit, you have to change text boxes as following
"<input type='text' name='[user_"+ index +"]'/>"+
In server request object, you will be give as array of key/values.
Option 2
If you are planing to make AJAX request, again you can loop though the text boxes and build the JSON format which you want in back-end and pass though the AJAX.
$("input[type='text']").each(function(input){
$(input).val();
});

Javascript to get sharepoint form field value to a variable

I want to copy the content of a sharepoint form field to a variable using Javascript.
Eg. I have a field named "Language" in my sharepoint edit form. Now I just want to get the value of that field to a varaible x.
Please help.
BR

It depends on the type (e.g. user, lookup, multilookup, text, note, etc.) of field. I am using jQuery in my custom list forms and the name of the field for any given content type will be added to the id of the corresponding html control with the text 'Field' appended to it. However, like any typical asp.net control, the id of the html form control rendered to the client will reflect its control hierarchy so you have to account for that when searching for a field. anyhow, the following works for me if i need to reference fields in my custom forms. ** notice the +Field which implies that the name of the field is concatenated with 'Field'
var $titleField = $('input[id*=TitleField]');
var $lookupField = $('select[id*=Name_Of_Field+Field]')
var $multiLookUpCandidate = $('select[id*=Name_Of_Field+Field][id*=SelectCandidate]')
var $multiLookUpResult = $('select[id*=Name_Of_Field+Field][id*=SelectResult]')
var $note = $('textarea[id*=Name_Of_Field+Field]');
You can pick up on the trend by viewing source and seaching for your contenttype/sitecolumn field name. You will find it in an html form control id. use that information to learn how to reference other field types.

Without posting your code its very difficult to understand what you want to do.... to get a value from a form you can do the following :
HTML
<form id="myform">
<input id="myinput" type="text" value="something" />
</form>
JavaScript:
var myinputval = document.getElementById("myinput").value;
myinputval would be "something" in this example
Demo : http://jsfiddle.net/Qk6FZ/

This might help:
http://depressedpress.com/2012/09/24/obtaining-a-javascript-reference-to-a-sharepoint-field/
Using that function you'd get the reference using something like:
var LanguageFld = getFieldRef("Language");
Once you have the refernece it's easy to get the value:
var CurValue = LanguageFld.value;
Hope this helps!

How to generate a dynamic form using javascript/jQuery?

I need to generate an entire html form dynamically based on the Ajax response from server. In response there will be information like input type , input labels, validations if any etc.
The form at most will always have ten fields.
Is there any jQuery/ javascript tool/plugin to generate the form?
Thanks.

Formation
From their example:
value = {"key":"value"} "key" will be the value attribute and "value" will be the shown value of the element. If the array is constructed like {"value",value","value"} (without keys) then the value attribute of the input will be an auto-incremented number starting from 0.
options = {} See options table below.
$.fn.formation(options); [Create a form]
$.formation.addInput(options); [Append an input]
$.formation.addSelect(values,options); [Append a select]
$.formation.addTextarea(options); [Append a textarea]
$.formation.addCheckboxes(values,options); [Append an unordered list of checkboxes]
$.formation.addRadios(values,options); [Append an unordered list of radio buttons]
$.formation.addCaptcha(options); [Adds a captcha question to your form]
$.formation.addButton(options); [Append a button]
$.formation.setErrorMessages(options); [Set custom error messages for validation]
However, this is all stuff you can easily do with Jquery, and it is a good learning experience so I recommend trying it yourself.