Rendering a Django radio button - django-forms

I have this form , with choices
subject_type = forms.ChoiceField(choices=Subject_type.objects.all(),
widget=forms.RadioSelect)
but I want to render these choices with radio buttons in html, but I have troubles.

You can still define your choices even though they are in a database:
subject_choices = dict([ (subject.id, subject.name) for subject in Subject_type.objects.all() ])
And then
subject_type = forms.ChoiceField(choices=subject_choices, widget=forms.RadioSelect)
Hope that helps.

Related

Looking a way to automatically change one element on a website to another one. Hyperlink to a button exactly

So i have hyperlink at a webpage that is:
<b>456</b>
And i want it to be a button instead of hyperlink.
Like:
<input type="button" class="butt1" name="but" value="456" onclick="123.com'">
I tried to change it inside chrome dev tools and it works, well obviously since i jsut give it href adress manually. Sadly i have no expirience with tampermonkey or greasemonkey at all and very limited javascript knowledge. Wonder if it possible and would appretiate any help.
Here is a sample code based on your example...
First, you need to get the link
If it is only one link, find it based on a selector:
const a = document.querySelector('a.cs');
Create the input
const input = document.createElement('input');
input.type = 'button';
input.className = 'butt1';
input.name = 'but';
input.value = '456';
input.onclick = 'window.location.href=' + a.href;
Note: A better way is to use input.addEventListener('click', function) instead of onclick.
Replace the link with the button
a.parentNode.replaceChild(input, a);
If there are more than one links, then you need to get them and loop through them e.g.
const a = document.querySelectorAll('a.cs');

How to change Laravel crudbooster datamodal to a select2

The below code works and I can create a measurement modal that displays the kgs, grams etc but was wondering if there is a way to do it as a dropdown select2 instead as the list is quite short. the two I've tried below show just the label but no select2 box. Any ideas? regards
$columns = [];
$columns[] = ['label'=>'Quantity','name'=>'quantity','type'=>'number','required'=>true];
$columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'select2','datatable'=>'measures,measure'];
$columns[] = ['label'=>'Measure2','name'=>'measures_id','type'=>'select2','validation'=>'required|integer|min:0','width'=>'col-sm-5','datatable'=>'measures,measure'];
// $columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'datamodal','datamodal_table'=>'measures','datamodal_columns'=>'measure','datamodal_select_to'=>'measure:measure','required'=>true];
Found how to do it by changing select2 to select.Not sure what the difference is.
From:
$columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'select2','datatable'=>'measures,measure'];
to:
$columns[] = ['label'=>'Measure','name'=>'measures_id','type'=>'select','datatable'=>'measures,measure'];
That's correct. Since I cannot comment I'll suggest you the difference by adding an aswer.
The difference is:
Select : Standard HTML element, rendered by the browser and working according to its own code.
Select2: Select2 is a jQuery library that "improves" your select elements by adding HTML code to render options and adding functions. For example, you may add a search box to filter your options, or you can style the dropdown better.
Library url : select2.org

RadioButton isChecked control state android

Here is the case : i have 4 radioButtons that are not members of a radioGroup. Thats because RadioGroup places children in vertical order by default and cannot place them relative to each other.Right now , i am check all the radioButtons. What i want to achieve is to control their checked state , so that when one is checked(true) the others checked state is set automatically to false. There widgets are independent layout elements , so i guess i have to find a way to group them all together. I tried it by coding 4 RadioButton variables with a simple if..else if function using isChecked and setChecked built-in methods. Then i tried grouping them in an Radiobutton[] array and looping to the array.length with a switch-case loop. Nothing works.
Stack for 2 days now. Any help appreciated.
Thanks for reply , i explain further. I have 4 imageViews and 4 radioButtons exactly below each one , in a RelativeLayout parent , so that the user can make a choise which image he prefers. The imageViews are not vertically placed , so are the radioButtons. Thats why i dont want to use radioGroup. I could use LinearLayout and place imageViews in vertical orientation and have the radioButtons in a group just aside them. Every radioButton checked state is false by default and when i check it , becomes true. The problem is that i can check all of the radioButtons . What i want is when i select one RadioButton , the others are automatically unchecked , so that only one may be checked at any time.
Here is the snippet:
private RadioButton rbtnWater;
private RadioButton rbtnRoad;
private RadioButton rbtnBoy;
private RadioButton rbtnLeft;
rbtnWater = (RadioButton) findViewById(R.id.rbtnWater);
rbtnRoad = (RadioButton) findViewById(R.id.rbtnRoad);
rbtnBoy = (RadioButton)findViewById(R.id.rbtnBoy);
rbtnLeft = (RadioButton) findViewById(R.id.rbtnLeft)
//method called at onClick attribute (XML)
public void checkState(View v) {
if (rbtnWater.isChecked()) {
rbtnLeft.setChecked(false);
rbtnBoy.setChecked(false);
rbtnRoad.setChecked(false);
}
else if (rbtnLeft.isChecked()) {
rbtnBoy.setChecked(false);
rbtnWater.setChecked(false);
rbtnRoad.setChecked(false);
}
else if (rbtnBoy.isChecked()) {
rbtnWater.setChecked(false);
rbtnRoad.setChecked(false);
rbtnLeft.setChecked(false);
}
else if (rbtnRoad.isChecked()) {
rbtnWater.setChecked(false);
rbtnBoy.setChecked(false);
rbtnLeft.setChecked(false);
}
}
It not really clear what is not working, please add details
That being said I suggest you change the technique and use a RadioGroup anyway, just extend it and modify to what you need or take it's source code from AOSP and instead of having it extend a LinearLayout you can extend something else you would rather work with

DropDownList : Style the Unselected Choice

We're using the Html.DropDownList and other controls in various MVC3 user data entry forms.
When a user is editing a records data values and they haven't specified values for a DropDownList then the optionLabel text of 'Select One' is displayed in the input field.
We'd like to make it more obvious to the end-user when they're viewing a screen of data that 'Select One' isn't a data value by showing it in a different font colour (blue ?) and in italics.
Has anyone any ideas how to simply achieve this ?
If the DropDownList is required... just mark that field as requiered using the somehow standard red "(*)". If the user submit the form, the client side validation will display the message telling the user that this field is required.
The level of customization of the <select> HTML element is pretty limited. IIRC you could change the color but I am not sure that you can show it in italics:
#Html.DropDownListFor(
x => x.Foo,
Model.Foos,
"-- select a foo --",
new { #class = "foo" }
)
and then in your CSS file define the .foo rule:
.foo option:first-child {
color: red;
}
If you want more customizations of the look and feel of the standard <select> element you might take a look at some of the available jQuery plugins.

Telerik MVC grid-How to set default row selected

Is it possible to render a Grid with one row selected as default (set the right page number and highlight the row)?
For highlighting, try using the "OnRowDataBound" event
.ClientEvents(events => events.OnRowDataBound("onRowDataBound"))
with something like
function onRowDataBound(e) {
var myId = $('#MyId').val();
if (e.dataItem.Id == myId)
e.row.className = 't-state-selected';
}
I'm still trying to figure out how to set the correct initial page number. This bloke might be on to something.
Use the Grid RowAction method, eg:
.RowAction(row => row.Selected = row.DataItem.CustomerCode.Equals(ViewBag.ID))
It is perhaps possible if you iterate in the grid source, locate the row which has to be selected in it, than use a formula to detect on which page will be displayed, and finally change the page index on initial load and select it.

Resources