Posts Tagged ‘Javascript’

script.aculo.us provides JS libraries for animation, drag and drop, Ajax controls, DOM utilities, and unit testing. Good to know.

http://script.aculo.us/

<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js&#8221; language=”javascript”></script>
<script language=”javascript”>
$(document).ready(function() {
window.setTimeout(function() {$(‘#box’).removeClass(“box1”).addClass(“boxCls”);}, 5000);

});

</script>
<style type=”text/css”>
.boxCls {
position: absolute;
width: 200px;
height: 200px;
top: 0;
left: 200px;
background-color: white;
border: 10px solid black;
}

.box1 {
position: absolute;
width: 50px;
height: 50px;
top: 0;
left: 0;
background-color: yellow;
border: 2px solid red;
float:left;
}
</style>
</head>
<body>
<div id=”box” class=”box1″>Box</div>
</body>
</html>

http://www.sencha.com/

http://docs.sencha.com/ext-js/4-0/#/guide/getting_started

http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/

In IE/Firefox we can use window.showModalDialog to show modal popup window. 
Use window.returnValue in the popup window to pass the selections to parent window.
Main Page Code ...
<script type="text/javascript">
    function ModalPopup() {
        var retValue = window.showModalDialog('popup.htm', 'height=200,width=150');
        alert(retValue);
    }
    </script>
    <a href="#" onclick='javascript:ModalPopup()'>Click</a>
Popup Window Code ...
<script>
        function dosubmit() {
            window.returnValue = document.getElementById("txtName").value;
            window.close();
        }
    </script>
    <a href='#' onclick='javascript:dosubmit()'>Close</a>
    <input value="hi" type="text" id="txtName" />
But this showModalDialog has disadvantages like it will not work in Chrome and some other browsers and also test automation of UI using Selenium software will not.
Refer the below links for solution on Selenium issue ...
http://seleniumdeal.blogspot.com/2009/01/handling-modal-window-with-selenium.html
http://seleniumdeal.blogspot.com/2010/04/working-with-modal-dialogs-and-selenium.html

JSON to C# object to JSON

Posted: September 8, 2011 in C#, Javascript, JQuery, JSON
Tags: , , ,

[DataContract]
public class SearchFilter
{
[DataMember]
public string SearchCol { get; set; }
[DataMember]
public string SearchOp { get; set; }
[DataMember]
public string SearchText { get; set; }
[DataMember]
public int PageNo { get; set; }
}
using System;
using System.IO;
using System.Runtime.Serialization.Json;
using System.Text;
public class JSONHelper
{
public static T Deserialise<T>(string json)
{
T obj = Activator.CreateInstance<T>();
using (MemoryStream ms = new MemoryStream(Encoding.Unicode.GetBytes(json)))
{
DataContractJsonSerializer serializer = new DataContractJsonSerializer(obj.GetType());
obj = (T)serializer.ReadObject(ms);
ms.Close();
return obj;
}
}

public static string Serialize<T>(T obj)
{
DataContractJsonSerializer serializer = new DataContractJsonSerializer(obj.GetType());
using (MemoryStream ms = new MemoryStream())
{
serializer.WriteObject(ms, obj);
return Encoding.Default.GetString(ms.ToArray());
}
}
}
Usage –

SearchFilter lSearchFilter = JSONHelper.Deserialise<SearchFilter>(“{‘SearchCol’:’Col1′,’SearchOp’:’contains’,’SearchText’:’hi’}”);
lSearchFilter.SearchCol
lSearchFilter.SearchOp

function ToJSONKeyValueFormat(pKey, pValue, pIsString) {
return ((pIsString)? (“\”” + pKey + “\”:\”” + pValue + “\””) : (“\”” + pKey + “\”:” + pValue));
}
function ToJSONFormat() {
var lJSONString = “”;
for (var i = 0; i < arguments.length; i++) {
lJSONString = ((i === 0)? “{” + arguments[i] : lJSONString = lJSONString + “,” + arguments[i]);
}
return ((lJSONString !== “”) ? lJSONString + “}” : “”);
}

Usage:

ToJSONFormat(ToJSONKeyValueFormat(“Key1”, “Val1”, true), ToJSONKeyValueFormat(“Key2”, 2, false))

Output:

{\”Key1\”:\”Val1\”,\”Key2\”:2}

String.prototype.format = function() {
    var args = arguments;
    return this.replace(/{(\d+)}/g, function(match, number) {
        return typeof (args[number] != 'undefined') ? args[number] : '{' + number + '}';
    });
};
Extending javascript global object is not a good idea. This can be defined as a utility funciton with in your application's global js object/file.

Extending  Reference - http://stackoverflow.com/questions/610406/javascript-equivalent-to-printf-string-format