Javascript

1. JavaScript Dates

<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getTime();</script>

var d = new Date();
var d = new Date(milliseconds);
var d = new Date(dateString);
var d = new Date(yearmonthdayhoursminutessecondsmilliseconds);

</script>


2.Add attribute in Jquery

$("#" + name).attr("disabled", "disabled");
$("#" + name).removeAttr("disabled");


3.Convert Micrsoft Json time format to datetime

var date = new Date(parseInt(YOURDATE.substr(6))).setHours(0, 0, 0, 0);


4.Javascript multiple ids

$('#pro1,#pro2,#pro3').click(function () {

    chart.series[0].update({

        data: $(this).attr('id');

    });

});




5.How to identify table row click in Javascript

<table class="table table table-bordered">
    <thead>
       <tr>
           <th>Contact ID</th>
           <th>Company</th>
           <th>First Name</th>
           <th>Last Name</th>
        </tr>
     </thead>
     <tbody>
        @if (Model.MatchingContacts != null)
          {
           foreach (var item in Model.MatchingContacts)
           {
               <tr class="click-row">
                    <td class="nr">@item.ContactId</td>
                    <td>@item.ContactName</td>
                    <td>@item.FirstName</td>
                    <td>@item.LastName</td>
               </tr>
            }
          }
      </tbody>
</table>

    $(".click-row").click(function () {
        var $row = $(this).closest("tr");    // Find the row
        var text = $row.find(".nr").text(); // Find the text
        $("#ContactId").val(text);
        debugger;
    });


6.Read ViewBag value in Javascript

var Id = @Html.Raw(Json.Encode(@ViewBag.Id));



7.Load google maps using Longitude and Latitude

   function InitializeMap() {
        var latlng = new google.maps.LatLng(Latitude, Longitude);
        var myOptions =
            {
                zoom: 8,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                disableDefaultUI: true
            };
        map = new google.maps.Map(document.getElementById("map"), myOptions);       
    }


8.Work drop down list with Javascript

get value
var s = document.getElementById("ServiceBy");

var value = s.options[s.selectedIndex].value;
var text = s.options[s.selectedIndex].text;


Set list to DDL

$.each(List, function (i, value) {                   $('#DDL').append($('<option>').text(value.Text).attr('value', value.Code));
});



9.Load scripts on condition by Javascript

<script>
    var head = document.getElementsByTagName('head')[0];
    var js = document.createElement("script");
    var language = localStorage.getItem("language");

    js.type = "text/javascript";

    if (language == "SV") {
        js.src= "https://kendo.cdn.telerik.com/2017.3.1018/js/messages/kendo.messages.sv-SE.min.js";
    }
    head.appendChild(js);
</script>



10.Dynamic class create (Click function)


$(document).on('#event','#selector',function () {...});
$(document).on('click','.sleep_avail',function () {...});

https://stackoverflow.com/questions/18528345/click-event-is-not-working-for-dynamically-changed-class-in-jquery/18528416#18528416



11.Call MVC controller in Ajax


<div class="panel panel-primary">
    <div class="panel-heading">
        Test Data from API
    </div>   <!--en dof panel-heading -->
    <div class="panel-body">
        <table class="table table-bordered" id="Table">
            <tr>
                <th>Name</th>
                <th>Age</th>
                <th>Edit</th>
            </tr>   <!--end of table-row -->
        </table>   <!--end of table -->
    </div> <!--end of Panel-body -->
</div> <!--end of Panel -->

    $("#mvc").click(function () {
        
        $.ajax({
            type: "GET",
            url: "/Home/GetDetails",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                $('#Table').append('');
                $("#DIV").html('');
                var DIV = '';
                $.each(data, function (i, item) {
                    var rows = "<tr>" +
                        "<td id='RegdNo'>" + item.Name + "</td>" +
                        "<td id='Name'>" + item.Age + "</td>" +
                        "<td id='ID'> <input type='button' value='Edit' id='" + item.ID + "' onclick='edit123(this)' /> </td>" +
                        "</tr>";
                    $('#Table').append(rows);
                });
            },
            error: function (data) {
                alert(data.responseText);
            },
        });

    });



        [HttpGet]
        public JsonResult GetDetails()
        {
            try
            {
                List<HomeModel> model = new List<HomeModel>();               
                model = _home.GetDetails();
                return Json(model, JsonRequestBehavior.AllowGet);
            }
            catch (Exception ex)
            {

                throw ex;
            }


        }



12. Call API in Ajax

    $("#API").click(function () {
        jQuery.support.cors = true;
        $.ajax({
            type: "GET",
            url: "http://localhost:54248/api/Values/GetDetails",
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                $('#Table').append('');
                $("#DIV").html('');
                var DIV = '';
                $.each(data, function (i, item) {
                    var rows = "<tr>" +
                        "<td id='RegdNo'>" + item.Name + "</td>" +
                        "<td id='Name'>" + item.Age + "</td>" +
                        "<td id='ID'> <input type='button' value='Edit' id='" + item.ID + "' onclick='edit123(this)' /> </td>" +
                        "</tr>";
                    $('#Table').append(rows);
                });
            },
            error: function (data) {
                alert(data.responseText);
            },
        });

    });



        [Route("GetDetails")]
        [WebMethod]
        [HttpGet]
        public IHttpActionResult GetDetails()
        {
            try
            {
                List<HomeModel> model = new List<HomeModel>();
                model = _home.GetDetails();
                return Json(model);
            }
            catch (Exception ex)
            {

                throw ex;
            }


        }

No comments:

Post a Comment