popup with bootstrap - html

how can i create a popup with MVC bootstrap?
I have this code, when I click on "generate password" calls to a function (it´s in my controller Admin) and it returns me a string. How can i display the string in a popup window??
<div class="editor-field" title="User Password">
<a class="btn btn-primary btn-small" href="#"
onclick="location.href='#Url.Action("GeneratePsw", "Admin", null)'; return false;">
<i class="icon-lock icon-white"></i> Generate password
</a>
</div>

Since event listeners are better than click events, I'd probably do something like this:
<div class="editor-field" title="User Password">
<a id="pwd_gen" class="btn btn-primary btn-small" href="#">
<i class="icon-lock icon-white"></i> Generate password
</a>
</div>
$(function() { // document.ready shorthand
$('#pwd_gen').click(function() {
var myPwd = $(this).location.href='#Url.Action("GeneratePsw", "Admin", null);
alert(myPwd); // or however you want to handle it with Bootstrap
});
});

$(document).on("click", ".open-ShowPwdDialogUser", function () {
var pwd="";
$.get("#Url.Action("GeneratePsw", "Admin")",function(data){
pwd=data;
$(".modal-body #pwdUser").val(pwd);
$('#1').modal('show');
});
})

Related

Redirect to another page on click of button

I had made a button through which I want to redirect to another page using angularjs.
It can be done if I write the code on the same page on which the button is created but i don't want to do that. So help me.
<button type="button" class="btn btn-sm bg-darkgreen addemployeeformbtn"</i> Add New</button> </li>
<button type="button" ng-click="redirect()" ...>
And on controller:
$scope.redirect = function(){
$window.location = "../#/SampleManagementView/";
}
<nav>
<a routerLink="/SampleManagementView">Sample Management</a>
</nav>
<router-outlet></router-outlet>

How Can I add a class to an HTML.ActionLink in MVC?

I have html code which is posted below. I would like to apply that Delete and Edit Button class to HTML Action Link.
Here is my code.
#Html.ActionLink("Edit", "EditUser", new { UserName = item.UserName }) |
#if ((item.UserName.ToLower() != this.User.Identity.Name.ToLower()))
{
#Html.ActionLink("Delete", "DeleteUser", new { UserName = item.UserName },
new { onclick = "return confirm('Are you sure you wish to delete this user?');" })
}
This HTML Code for Delete and Edit:
<a href="#" class="btn btn-info btn-xs black">
<i class="fa fa-trash-o"></i> Delete
</a>
<a href="#" class="btn btn-success btn-xs purple">
<i class="fa fa-edit"></i> Edit
</a>
How can I make it work?
Help would be appreciated.
You have to use the # character, since class is a keyword in C#. Here's a link to the MSDN documentation: http://msdn.microsoft.com/en-us/library/dd492124(v=vs.108).aspx
#Html.ActionLink("<i class='fa fa-trash-o'></i> Delete", "DeleteUser",
new { UserName = item.UserName },
new { #class = "btn btn-info btn-xs black" })

Submit a form with href

I set the if of the form is as follows:
#using (Html.BeginForm(new {#id="frmHomeInsurance"}))
and instead of using a submit button, I would like to have a submit link.
So, I would like to replace the following:
<input type="submit" value="Get your quote now!" class="btn btn-default"/>
with the following:
<span class="fa fa-comments-o"></span>Get your<br>quote now!
In theory, it should reach at my 'Create' action in my HomeInsurance controller, however, it's not.
Is there anything else I should declare before?
Update:
The action is as follows:
// POST: HomeInsurance/Create
[HttpPost]
public ActionResult Create(HomeInsuranceModel model)
{
}
You can't directly use the href to submit the form.
Create the form like this:
#using(Html.BeginForm("Create", "HomeInsurance", FormMethod.Post, new {enctype = "multipart/form-data"}))
{
<define you form>
}
and then use your anchor tag to submit it(no href is needed):
<a href="javascript:;" class="wow zoomIn" data-wow-delay="0.2s"
onclick="document.forms['frmHomeInsurance'].submit(); return false;">
<span class="fa fa-comments-o"></span>Get your<br>quote now!
</a>
if you want to use the href you can do this but its not very pretty:
<a href="#Url.Action("Create", "HomeInsurance")"
onclick="var e=document.getElementById('yourFormId').action=this.href;e.submit();return false">
Submit</a>

How to data-bind with Razor and Knockout

I'm trying to set a Knockout-bound function's parameter with Razor. I've tried...
<a href="#" data-bind="click: function() { return myFunc(#Type.SomeType.ToString()); }">
Click Me
</a>
and..
<a href="#" data-bind="click: function() { return myFunc(#Html.Raw(Type.SomeType.ToString())); }">
Click Me
</a>
and..
<a href="#" data-bind="click: function() { return myFunc('#Html.Raw(Type.SomeType.ToString())'); }">
Click Me
</a>
and..
<a href="#" data-bind="click: function() { return myFunc('#(Html.Raw(Type.SomeType.ToString()))'); }">
Click Me
</a>
Is there a right way to do this?
(Background: this is for use in a bootstrap dropdown)
You can try to surround data-bind attribute with single quotes (') and pass the parameter using Json.Encode.
Full example:
#{
// A string with a lot of special characters
string myStr = "abc\"\\/'#{}#.:xyz";
}
<span data-bind='click: function() { myFunc(#Json.Encode(myStr)); }'>
Click Me
</span>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-debug.js"></script>
<script>
ko.applyBindings({
myFunc: function (myParam) {
console.log(myParam);
}
});
</script>
In your case it would be:
<a href="#" data-bind='click: function() { return myFunc(#Json.Encode(Type.SomeType.ToString())); }'>
Click Me
</a>

Converting Html.action link to a regular link

I have the following code generated by default from asp.net mvc
#Html.ActionLink("Details", "Details", new { item.ORG_ID })
But I am using an open source web template where I can display a user friendly button such as:-
<a class="btn btn-success" href="#">
<i class="icon-zoom-in icon-white"></i>
View
</a>
So my question is ; how I can convert the html.actionlink to be <A> link
Regards
<a class="btn btn-success" href="#Url.Action("Details", new { item.ORG_ID })">
<i class="icon-zoom-in icon-white"></i>
View
</a>