Few tips

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4061

Just few jQuery lines of code:

 

Take cell value from DataTables.net:

 $("#myTable").data().oTable.fnGetData(0).

Date Convert string to date using current format:

 $.datepicker.parseDate($.datepicker._defaults.dateFormat, myStringDate)

Increment date:

 date.setDate( date.getDate() + 1 );

To have dialog inside of dialog, then I have to close existing one (at this moment I don’t know if there is possibility to have two modal windows at the same time)

$(this).dialog('close');
dialogs.alertUI("Export confirm", "Are you sure?", myTest, null);

Delete all single quotes from a string:

myMessage.replace(/'/g, "");

Unobtrusive validation

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4704

If you are adding fields dynamically, and you want to have unobtrusive validation, then you can use following code: 

var $nazivIndex = -1;

function addNewFieldNaziv() {
    $nazivIndex++;
    var $nazivEf = $('#nazivEf');
    $nazivEf.append('<p/><input class="text-box single-line valid" id="Naziv' + $nazivIndex
        + '" name="Naziv' + $nazivIndex
        + '" type="text" value="Stanko Milosev" data-val="true" data-val-required="The Naziv field is required."/> <span class="field-validation-valid" data-valmsg-for="Naziv' + $nazivIndex + '" data-valmsg-replace="true"></span>');
    
    var form = $("#myID");
    form.removeData('validator');
    $.validator.unobtrusive.parse(form);

}

Validation has to be removed, and then binded again. Also, in your ASP.NET MVC3 view you have to add following scripts:

<script src="/@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="/@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

<script src="/@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="/@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
<script src="/@Url.Content("~/Scripts/MicrosoftMvcValidation.js")" type="text/javascript"></script>

Here you can download my MVC3 application, code is dirty :) but you can see an example if you go on http://localhost:7307/Default1/Edit/1# for instance (Default1 controller, Edit method). Here you can see pure html example, or here you can download packed source. Unfortunately, you will see that this code is also dirty, I have two times $("#myID").validate, on the beginning and on the end, otherwise it didn't want to work, and I have no idea why.

In my MVC3 application in file unobtrusive_validation\unobtrusive_validation\Views\Default1\Edit.cshtml you will see code like:

<script src="/@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="/@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>
<script src="/@Url.Content("~/Scripts/MicrosoftMvcValidation.js")" type="text/javascript"></script>

<script src="/@Url.Content("~/Scripts/addFields.js")" type="text/javascript"></script>

and

@using (Html.BeginForm("Edit", "Default1", FormMethod.Post, new { id = "myID" }))
{

Without these lines validation will not work, of course  in model in the file unobtrusive_validation\unobtrusive_validation\Models\Partner.cs you will see

[Required]
public string Naziv { get; set; }

"Naziv" means name btw :)

---

On the end my problem was solved as it was described here. Also, one my simple validation you can find here.

Element select

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4060

 

$('ui_tpicker_time_fromDateTableFilter') – DOM element (like DIV):

$('.ui_tpicker_time_fromDateTableFilter') – it is class – DOT means class

$('#ui_tpicker_time_fromDateTableFilter') – hash means ID - it is ID like: 

<dd class="ui_tpicker_time" id="ui_tpicker_time_fromDateTableFilter">10:02</dd>

 

Global function

Details
Written by: Stanko Milosev
Category: jQuery
Hits: 4184

For example, if you have JS file in which you want to call function from another js file, something like onClose event of datePicker:

 

test.js:

$(function() {
      $('#datepicker').datepicker({dateFormat: 'yy-mm-dd',
            onClose: function(dateText) {
                  myCall();
            }
      });
});

index.html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Datepicker - Default functionality</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <script src="/test.js"></script>
    <script>
    	
			var myTest = function myFunc() {
	        alert("test");
	    };
	    
	    myCall = myTest;
    	
    </script>
</head>


<body>

<p>Date: <input type="text" id="datepicker" /></p>



</body>
</html>
  1. How To Prevent jQuery UI Slider Overlap In jQueryUI
  2. Retrieving the dateFormat from jQuery UI datepicker and formating date
  3. Disappearing polylines
  4. Memory leak

Subcategories

Ajax

JavaScript

ExtJS


jQuery

Bing Maps AJAX Control, Version 7.0

Knockout

Jasmine

Moment

node.js

Page 13 of 24