I have a problem here which i am working quite a while but do not have any ideas left for a solution. I will try to make it short:
I use the eColumns extension for the admin and the view module in yii. I added a combobox to select views which are saved in the database so that users can build their own selection of select columns for each table, however:
In eColumns i added a button to delete an already created selection and an input field to give the selection a name
CHtml::button('', array('type' => 'submit','name' => 'btn_delete','value' => 'Ansicht löschen', 'onclick' => '$("#'.$this->getId().'").dialog("close");', 'style' => 'align: left', 'confirm'=>'Sind sie sicher das sie diese Ansicht löschen möchten?'));
CHtml::textField('input_name', substr($this->selectedView,strpos($this->selectedView,"##")+2), array('size'=>30,'maxlength'=>200));
If i click the button in the view-module everything works as expected. $_POST is filled with "input_name" and "btn_delete". However if i this same code included in the admin-module only input_name is filled - btn_delete is simply not set if i click the button.
Anybody can i give me any hint what i can check?
Thanks in advance! :)
If you are using jQuery serialize() to collect form elements in your admin-module, jQuery serialize() will not serialize any submit button value.
See also serialize example, hope this will help. :)
=== links to jsfiddle must be accompanied by code.. ===
html
<form>
<input type="text" name="text" value="text-value">
<input type="submit" name="submit-btn" value="button-value">
</form>
<span name="result-serialize"></span>
jQuery
var serializeString = $("form").serialize();
$("span[name=result-serialize]").text(serializeString);
Related
so when my form group get loaded my drop down looks like this
my ng select code is
<ng-select
placeholder="select By Device"
appendTo="ng-select"
[clearable]="true"
[searchable]="true"
formControlName="byDevice">
<ng-option [value]="1">Desktop</ng-option>
<ng-option [value]="2">Laptop</ng-option>
<ng-option [value]="3">Tablet</ng-option>
<ng-option [value]="4">Mobile</ng-option>
</ng-select>
I want clearable option true because its filter
and when i click on close icon (clearable icon) i see placeholder like this
basically it should look like this when it gets loaded instead of empty option
so how do i do this
please help !!
Ok so I resolved issue you just have to assign null value to form control name
this.myForm = new FormGroup({
'byDevice':new FormControl(null)
});
like this
Thanks !!
I want to put a form in a popup.
I've found a solution but I'm looking for something cleaner.
I didn't find a way to poping-up an existing tag with swal.
So I created an hidden form in my template :
<div id="myHiddenForm"><form role="form">
<md-input class="email" md-type="email" md-label="Email" md-validate="true"
md-validate-error="invalid email">
<i md-prefix class="material-icons">account_circle</i>
</md-input>
<button type="submit" md-button>
<i class="left material-icons">done</i>Submit
</button>
</form></div>
Then I created the popup with it's innerHTML.
swal({
html: document.getElementById('myHiddenForm').innerHTML,
showConfirmButton: false,
}).catch(swal.noop);
Then I can attach a callback to the submit button and this works finally.
Obviously, I can't use md-value.bind because the displayed form is a copy of the original.
I can access the input's value, using document.querySelectorAll('#myHiddenForm .email input')[0].value but I'm wondering if there's a better way to do this ?
Maybe there's a nice approach to combine aurelia-materialize-bridge and sweetalert2.
I know there's a modal component but it's not capable of keeping the focus inside the modal popup ; plus I already use swal2 everywhere else in this webapp because, you know, it is so sweet.
After a lot of tests and the full reading of the sweetalert2 documentation, I found the correct way to handle this. We simply need to move the <form> node.
swal({
html: '<span></span>'
, showCloseButton: true
, showConfirmButton: false
, onBeforeOpen: dom => swal.getContent()
.appendChild(document.querySelectorAll('#myHiddenForm form'))
, onClose: dom => document.getElementById('myHiddenForm')
.appendChild(swal.getContent().querySelectorAll('form'))
}).catch(swal.noop);
It's perfect to use with aurelia because it preserve everything (monitors, events, validation...).
We don't even need to manually bind the submit button like I did, We can use aurelia's usual way.
Conclusion: RTFM !
I have 2 forms that I am testing using TestStack.Seleno. Both forms have a checkbox that is mandatory. The first form has (including the checkbox) 5 fields. I can use TestStack.Seleno to create a passing test with valid data. I set the checkbox like this:
Input.TickCheckbox(f=>f.Accept,form.Accept);
On my other form which has 10 or so fields, when I try to set the checkbox to be ticked (using the same code) nothing happens. However when I try
var acceptCheckBox = Find.Element(By.Name("Accept"),new TimeSpan(0,0,0,50));
if (form.Accept)
{
acceptCheckBox.Click();
}
I get error "Element is not currently visible and so may not be interacted with"
Element is clearly visible and is not injected in using javascript.
I am using latest version of TestStack.Seleno from github.
Any ideas?
So I have managed to figure out what the issue is and have a work around, however I cannot explain why it works on the other form. The mandatory Accept field has html generated by mvc that looks like
<div>
<input class="check-box" data-val="true" data-val-mustbetrue="The Accept our field is required" data-val-required="The Accept our field is required." id="Accept" name="Accept" type="checkbox" value="true"><input name="Accept" type="hidden" value="false">
<label for="Accept">
Accept our Please accept our Terms and Conditions
</label>
<span class="field-validation-valid" data-valmsg-for="Accept" data-valmsg-replace="true"></span>
</div>
So you have the checkbox and hidden field both with id Accept, I suspect in code seleno is picking up the hidden field and setting value, so I updated my code todo
var acceptCheckBox = Find.Element(By.CssSelector("#Accept.check-box"));
acceptCheckBox.Click();
Now everything works.
Ismail
I have an Index page which shows a list of data. The list can be filtered by selection from a dropdown list. This works okay. The first item in the dropdown has a blank value and the text "(all users)." So, this does what you expect--it shows all values in the list if you don't select an item to filter by. The razor for this is pretty simple:
#using (Html.BeginForm())
{
#Html.Label("userName", "View user:")
#Html.DropDownList("userName", ViewBag.UserName as SelectList, new { onchange = "this.form.submit()" })
}
In addition to viewing the list of data on the page, I offer a text file download of the currently filtered items. The razor for this is also pretty simple:
#using (Html.BeginForm("Download", "Checkout"))
{
#Html.Hidden("userName", Request["userName"])
<input type="submit" value="Download Metadata from Checked Out Files" />
}
This works right IF there's something selected in the filter dropdown. But if nothing is selected, then Request["userName"] returns "System.Web.Mvc.SelectListItem". I want it simply to be blank as the dropdown list appears when nothing is selected. What happens is that the value System.Web.Mvc.SelectListItem is passed to my download action and treated as a filter value.
So, the question is how to make it so a blank selection in my filter dropdown is not mistaken for "System.Web.Mvc.SelectListItem."
Try changing your #Html.DropDownList to this overload, string.Empty gives you the default blank option in your dropdown
#Html.DropDownList("userName", ViewBag.UserName as SelectList, string.Empty, new { onchange = "this.form.submit()" })
I hope I didn't misunderstand your question!
I have read multiple posts on similar issue but did not work.
I have fixed footer buttons and facing issue in calling "Post" version Edit action in Project controller. Here is what I'm trying to do
Let me know if question needs further explaination.
(I tried using Ajax.ActionLink which is suggested in multiple posts too but did not work out.
Similar Question
Finally I managed to fix it by some workarounds. Posting solution here to help someone.
Like I said earlier, I tried using Ajax.ActionLink but I was not able to achieve the same. Instead I looked for Calling Form Submit action from outside of form that's what I actually need here.
Form: Name your Form something, say "editProjDetailsForm"
#using (Html.BeginForm(null, null, FormMethod.Post,
new { #class = "form-horizontal",
name = "editProjDetailsForm" }))
Footer: Call this method from the footer button.
<input type="button" onclick="document.editProjDetailsForm.submit();"
class="btn btn-primary"
value="Save Changes" />
I tried this one too in footer but it did not workout:
#Ajax.ActionLink("Save Changes", "Edit", new { id = Model.ProjectId },
new AjaxOptions { HttpMethod = "POST" })
Helpful Posts
Naming A form using Begin Form
Submit Button outside HTML.BeginForm
Submit Button outside HTML.BeginForm (another link)
ASP.net ActionLink and POST Method
Error in case you have parameterized constructor in ViewModel and
did not declare parameterless constructor
Display Issue if you are using bootstrap In footer I had one input type = button and one action link with class= button. Both nested in one btn-group but there height were appearing different as visible in following snapshot:
Fix: Found that it is a known issue and there is one suggested solution but did not work out much for me (i.e. for Internet Explorer).
input type=submit and anchor button in btn-group appear as different sizes
Solution: add .btn { line-height:normal!important; } or if you want to do only for a specific button lets say the above input button then do this:
<input type="button" onclick="document.editProjDetailsForm.submit();"
class="btn btn-primary"
value="Save Changes"
style="line-height:normal!important;" />