<div class=”card-header container-fluid”> <div class=”col-md-10″><h3>Your Header Title</h3></div> <div class=”col-md-2 float-right”>The content you want to add to the right side.</div> </div>
Category: ASP.Net MVC
How to change star rating color on mouseover/out, mouseenter/leave with Javascript
function onMouseEnter(index){ var star = document.getElementsByClassName(“starClass”); var j; for(j = 0; j < fa.length; j++){ if(j < index){ star[j].style.color = “orange”; } else{ star[j].style.color = “#ccc”; } } } function onMouseOut(){ var star = document.getElementsByClassName(“starClass”); var k; for(k = 0; k < fa.length; k++){ star[k].style.color = “#ccc”; } }
How to get rows count in EntityFramework without loading contents
Query syntax: var count = (from t in context.MyTable where t.Id == @Id select t).Count(); Method syntax: var count = context.MyTable .Where(t => t.Id == @Id) .Count() Both generate the same SQL query.
How to use if else block to decide style in Razor
Declare a local variable at the beginning of the View: @{ var yourStyle = “”; if(Model.Condition) { yourStyle = “float:left;”; //specific conditions and logic } else { yourStyle = “float:right;”; //any other conditions and logic } } and then just use it in your div: <div style=”@yourStyle”>
How to check if javascript is enabled on the client’s browser
The noscript element represents nothing if scripting is enabled, and represents its children if scripting is disabled. It is used to present different markup to user agents that support scripting and those that don’t support scripting, by affecting how the document is parsed. <script type=”text/javascript”> //If javascript enabled then this part will work. //Your javascript code here… </script> <noscript>JavaScript disabled on your […]
How to disable ASP.Net button after click to prevent double clicking
Let’s say you have 2 buttons on your web page. <form id=”form1″ runat=”server”> <asp:Button ID=”Button1″ runat=”server” Text=”Button1″ OnClick=”Button1_Clicked” /> <asp:Button ID=”Button2″ runat=”server” Text=”Button2″ /> </form> Scenario 1: Disabling the specific button <script type=”text/javascript”> function DisableButton() { document.getElementById(“<%=Button1.ClientID %>”).disabled = true; } window.onbeforeunload = DisableButton; </script> The DisableButton JavaScript function is used for disabling specific Button when Clicked. […]
How to align inconsistently sized logos with CSS
These 3 lines will save you (fit, line up, remove background): aspect-ratio: 3/2; object-fit: contain; mix-blend-mode:color-burn; Let’s see how you can use that: In the body section, we have a div with the “photoDiv” class. <div class=”photoDiv”> <img src=”1.png”> <img src=”2.png”> <img src=”3.png”> <img src=”4.png”> <img src=”5.png”> </div> And here is the magical CSS: <style> […]
How to use client-side function on checkbox or any asp.net component
Here is the Asp part: <label for=”chkCondition”> <asp:CheckBox ID=”chkCondition” Text=”Should i show the div?” runat=”server” onclick=”ShowHideDiv(this)” /> </label> <hr /> <div id=”divToShowOrHide” style=”display: none”> this div will be shown regarding the checkbox checked status. <asp:TextBox ID=”myTextBox” runat=”server” /> </div> And here is the Javascript part: <script type=”text/javascript”> function ShowHideDiv(chkCondition) { var divToShowOrHide = document.getElementById(“divToShowOrHide”); divToShowOrHide.style.display […]
How to remove searching, filtering, ordering and info from Asp.NET MVC Datatable
var table = $(“#datatable”).DataTable({ “paging”: false, “ordering”: false, “searching”: false, “info”: false });
How to make a checkbox or dropdown readonly in Razor
You can add @disabled = “disabled” to the last parameter named HtmlAttributes. @Html.CheckBox(“someNameForYourCheckBox”, CheckedValue (True or Not), new { @disabled = “disabled” }) @Html.DropDownList(“someNameForYourDropDown”, YourSelectList (comes from Model), new { @disabled = “disabled” })
How to apply two classes to a single element in CSS
Let’s say you want to use 2 or more classes for a div. Then you should use these classes inside the class attribute, separated by whitespace: <div class=”myFirstClass mySecondClass”></div> To target elements that contain all of the specified classes, use this CSS selector (no space) in your CSS file: .myFirstClass.mySecondClass {}
How to change the style of scrollbar with CSS
::-webkit-scrollbar { width: 12px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; } ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } You can get more detail from here.
How to add scroll bar to div in Asp.Net
Let’s say we have div in view <div id=”myDiv” class=”div-with-scrollbar”> </div> With this CSS file, you can add a scrollbar .div-with-scrollbar { overflow-y: scroll; width: 100%; height: 500px; }
How to add Output Parameter to SqlDataSource
<asp:Parameter Name=”NewID” Direction=”Output” Type=”Int32″ DefaultValue=”0″ /> Here is a more detailed example in use: <asp:sqlDataSource ID=”EmployeeDetailsSqlDataSource” SelectCommand=”SELECT EmployeeID, LastName, FirstName FROM Employees WHERE EmployeeID = @EmpID” InsertCommand=”INSERT INTO Employees(LastName, FirstName) VALUES (@LastName, @FirstName); SELECT @EmpID = SCOPE_IDENTITY()” UpdateCommand=”UPDATE Employees SET LastName=@LastName, FirstName=@FirstName WHERE EmployeeID=@EmployeeID” DeleteCommand=”DELETE Employees WHERE EmployeeID=@EmployeeID” ConnectionString=”<%$ ConnectionStrings:NorthwindConnection %>” OnInserted=”EmployeeDetailsSqlDataSource_OnInserted” RunAt=”server”> <SelectParameters> <asp:Parameter […]
How to add default value for Entity Framework migrations for DateTime and Bool
Just add defaultValue parameter in CreateTable method for property: public partial class TestSimpleEntity : DbMigration { public override void Up() { CreateTable( “dbo.SimpleEntities”, c => new { id = c.Long(nullable: false, identity: true), name = c.String(), deleted = c.Boolean(nullable: false, defaultValue: true), }) .PrimaryKey(t => t.id); } public override void Down() { DropTable(“dbo.SimpleEntities”); } } After that, run update-database -verbose command, […]
How to put text inside MVC Razor code block
The contents of a code block ({ … }) are expected to be code or markup (tags), not plain text. If you want to put text directly in a code block, you have three choices: Wrap it in any HTML tag Wrap it in the special Razor <text> tag, which will just render the text without the […]
How to get the integrity value for a jquery version of script reference in a web page
You can use https://www.srihash.org/ to generate links. https://code.jquery.com/jquery-3.6.0.min.js will be generated as <script src=”https://code.jquery.com/jquery-3.6.0.min.js” integrity=”sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==” crossorigin=”anonymous”></script> You can get all the versions of jquery from here: https://releases.jquery.com/jquery/ Thanks to mscdeveloper for such great post.
How to get session value in Javascript
<script> let mySession = ‘<%= Session[“SessionName”].ToString() %>’; //use your session … console.log(mySession); alert(mySession); </script>