Free Code Snippets in C#, Net Framework, Office 365, ASP.Net,WPF, Visual Studio, SQL Server, Antivirus free
#

 

Selector:

With the selectors you can address different groups in jQuery.

The # hashtag is used to address an element with the id

With the . Point all elements of a Css class are addressed.

 

#id selector

$ ("# IDTest"). Hide () - affects exactly one element with ID id = "IDTest".

 

.class selector

$ (". cssTest"). hide () - matches all elements with the class css class = "cssTest".

 

 

jQuery example

id selector

The following example jQuery code addresses exactly the DIV element id = "divEditor" and transfers the HTML content to the element with the id = "Text1"

Asp Razor View

@Html.TextAreaFor(model => model.Text1, new { @class = "form-control", @rows = 4 })

<div contenteditable="true" id="divEditor" name="divEditor" style="height:200px;overflow:auto;">

@Model.Text2

</div>

..

 

<script type="text/javascript" src="~/lib/jquery/dist/jquery.js"></script>

<script>

    $("#btnTransfer").click(transfer_Text);

    function transfer_Text() {

        var sText = $("#divEditor").html();

        $("#Text1").val(sText);

    }

</script>

 

 

Razor-View Code.

The jQuery script is inserted at the very end.

@model IWois_Core.Models.Notes_Edit_DataModel

 

@{

    ViewData["Title"] = "Edit";

    Layout = "~/Views/Shared/_Layout.cshtml";

}

 

<div style="margin-top:20px;">

    <div class="col-md-push-0" style="margin-right:20%">

        <form asp-action="Edit">

           <br />

            <div asp-validation-summary="ModelOnly" class="text-danger"></div>

            <input type="hidden" asp-for="IDNote" />

           

            <div class="form-group">

                TextArea

                @Html.TextAreaFor(model => model.Text1, new { @class = "form-control", @rows = 4 })

                <br />

                Div

                <div contenteditable="true" id="divEditor" name="divEditor" style="height:200px;overflow:auto;">

                    @Model.Text2

                </div>

 

 

                <span asp-validation-for="Text" class="text-danger"></span>

            </div>

 

        </form>

    </div>

</div>

 

 

<button id="btnShow">show text</button>

<button id="btnTransfer">transfer text</button>

 

@section scripts {

    @{await Html.RenderPartialAsync("_ValidationscriptsPartial");}

}

 

<script type="text/javascript" src="~/lib/jquery/dist/jquery.js"></script>

<script>

    $("#btnShow").click(show_Text);

    $("#btnTransfer").click(transfer_Text);

 

    function show_Text() {

        var sText = $("#divEditor").html();

        alert(sText);

    }

 

    function transfer_Text() {

        var sText = $("#divEditor").html();

        $("#Text1").val(sText);

    }

</script>

 

 

 

 

 

 

 

 

 

Mobile
»
Upload with progress bar, Ajax
»
jQuery: Set the value of a progress display
»
Upload and view files with jQuery ajax, FileUpload, View the jsonResults
»
jQuery: 1-Button file upload with autostart
»
Asp jQuery: upload files with Ajax
»
jQuery: execute function before submit with send
»
Execute jQuery: function after loading a page
»
jQuery: insert HTML into an element
»
jQuery: Paste Event on Inserting Content into HTML Element
»
jQuery: Insert event When Text or HTML Inserted in Element

.

Contact for Jobs, Project Requests: raimund.popp@microsoft-programmierer.de