Net Framework, Office 365, C#, WPF, ASP.Net, Visual Studio, Programmiersprachen PC, C# Programmieren, vba, SQL Server, free source code snippets Antivirus free
#

 

 

Selector:

mit den Selectoren kann man in jQuery verschiedenen Gruppen ansprechen.

Mit dem # HashTag wird ein Element mit der id angesprochen

Mit dem . Punkt werden alle Elemente einer Css Klasse angesprochen.

 

#id Selector

$("#IDTest").hide() – betrifft genau das eine Element mit der ID id="IDTest".

 

.class Selector

$(".cssTest").hide() – betriff alle Element emit der Css-Klasse class="cssTest".

 

 

jQuery Beispiel

id-Selector

Das folgende jQuery code Beispiel spricht exakt das DIV Element id="divEditor" an und überträgt den HTML-Inhalt an das Element mit der 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.

Das jQuery script steht ganz am Ende eingefügt.

@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 mit Progress Bar
»
jQuery: Wert einer HTML Progress Anzeige einstellen
»
Dateien hochladen und anzeigen mit jQuery ajax, FileUpload, Anzeigen des json Results
»
jQuery: 1-Button File-Upload mit Autostart
»
Dateien mit Ajax hochladen : Asp Net Core MVC und jQuery
»
jQuery: Function vor Submit Senden ausführen
»
jQuery: function nach dem Laden einer Seite ausführen
»
jQuery: HTML Elemente in ein Element einfügen
»
jQuery: Paste Event beim Einfügen von Text in ein HTML Element
»
jQuery: Insert event bei Text Eingabe

.

Jobs, Projekte, Angebote für Freiberufler, Selbstständig an Raimund.Popp@Microsoft-Programmierer.de