Technical Developer

Saturday, November 15, 2014

json spring mvc java

@RequestMapping(value = "/rest/create/document", produces = "text/plain;charset=UTF-8")
@ResponseBody
public String create(Document document, HttpServletRespone respone) throws UnsupportedEncodingException {

    Document newDocument = DocumentService.create(Document);

    return jsonSerializer.serialize(newDocument);
}

<mvc:annotation-driven>
  <mvc:message-converters register-defaults="true">
    <bean class="org.springframework.http.converter.StringHttpMessageConverter">
      <property name="supportedMediaTypes" value = "text/plain;charset=UTF-8" />
    </bean>
  </mvc:message-converters>
</mvc:annotation-driven>

Or code-based configuration:
@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {

  private static final Charset UTF8 = Charset.forName("UTF-8");

  @Override
  public void configureMessageConverters(List<HttpMessageConverter<?>> converters) {
    StringHttpMessageConverter stringConverter = new StringHttpMessageConverter();
    stringConverter.setSupportedMediaTypes(Arrays.asList(new MediaType("text", "plain", UTF8)));
    converters.add(stringConverter);

    // Add other converters ...
  }
}

jquery-window-events

ref: https://github.com/unyereno/power-show/blob/master/JQWidgets/demos/jqxwindow/jquery-window-events.htm

ref: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxwindow/jquery-window-events.htm?web\

<!DOCTYPE html>

<head>

<title id='Description'>This demo demonstrates how to trigger some of the jqxWindow events like open, closed and moved.</title>

function capitaliseFirstLetter(string) {

return string.charAt(0).toUpperCase() + string.slice(1);

}

function displayEvent(event) {

var eventData = 'Event: ' + capitaliseFirstLetter(event.type);

if (event.type === 'moved') {

eventData += ', X: ' + event.args.x + ', Y: ' + event.args.y;

}

if (event.type === 'hide') {

eventData += ', Dialog result: ';

if (event.args.dialogResult.OK) {

eventData += 'OK';

} else if (event.args.dialogResult.Cancel) {

eventData += 'Cancel';

} else {

eventData += 'None';

}

$('#events').jqxPanel('prepend', '<div style="margin-top: 5px;">' + eventData + '</div>');

$('#events').jqxPanel('value', 1000);

}

function addEventListeners() {

//Closed event

$('#eventWindow').bind('close', function (event) {

displayEvent(event);

});

//Dragstarted event

$('#eventWindow').bind('moved', function (event) {

displayEvent(event);

});

//Open event

$('#eventWindow').bind('open', function (event) {

displayEvent(event);

});

$('#showWindowButton').mousedown(function () {

$('#eventWindow').jqxWindow('show');

});

}

function createElements(theme) {

$('#ok').jqxButton({ theme: theme, height: '25px', width: '65px' });

$('#cancel').jqxButton({ theme: theme, height: '25px', width: '65px' });

$('#eventWindow').jqxWindow({ maxHeight: 150, maxWidth: 280, minHeight: 30, minWidth: 250, height: 145, width: 270,

theme: theme, resizable: false, isModal: true, modalOpacity: 0.3,

okButton: $('#ok'), cancelButton: $('#cancel')

});

$('#events').jqxPanel({ theme: theme, height: '250px', width: '450px' });

$('#showWindowButton').jqxButton({ theme: theme, width: '100px', height: '25px' });

}

$(document).ready(function () {

var theme = $.data(document.body, 'theme', theme);

if (theme == undefined) theme = '';

addEventListeners();

createElements(theme);

$("#jqxWidget").css('visibility', 'visible');

});

</script>

</head>

<div style="width: 100%; height: 650px; border: 0px solid #ccc; margin-top: 10px;"

id="mainDemoContainer">

<div>Events Log:</div>

</div>

<div>

Modal Window</div>

<div>

Please click "OK", "Cancel" or the close button to close the modal window. The dialog

result will be displayed in the events log.

</div>

<div>

</div>

</body>

</html>

How to set dialog result

I get it – $(form).jqxWindow(‘dialogResult’, { OK : true, Cancel : false, None : false })

show loading message

A an idea on the matter is to temporarily disable your buttons after calling showloadelement and enable them after hideloadelement.

Sunday, October 26, 2014

Encoding / decoding UTF8 in javascript

From time to time it has somewhat annoyed me that UTF8 (today's most common Unicode transport encoding, recommended by the IETF) conversion is not readily available in browser javascript. It really is, though, I realized today:

function encode_utf8(s) {
  return unescape(encodeURIComponent(s));
}

function decode_utf8(s) {
  return decodeURIComponent(escape(s));
}

2012 Update: Monsur Hossain took a moment to explain how and why this works. It's a good, in-depth post citing all standards in play so you need not bring a wizard's beard to know why it works. Executive summary: escape and unescape operate solely on octets, encoding/decoding %XXs only, while encodeURIComponent and decodeURIComponentencode/decode to/from UTF-8, and in addition encode/decode %XXs. The hack above combines both tools to cancel out all but the UTF-8 encoding/decoding parts, which happen inside the heavily optimized browser native code, instead of you pulling the weight in javascript.

Tested and working like a charm in these browsers:

Win32

Firefox 1.5.0.6
Firefox 1.5.0.4
Internet Explorer 6.0.2900.2180
Opera 9.0.8502

MacOS

Camino 2006061318 (1.0.2)
Firefox 1.5.0.4
Safari 2.0.4 (419.3)

Any modern standards compliant browser should handle this code, though, so don't worry that it's a rather sparse test matrix. But feel free to use my test case: encoding anddecoding the word "räksmörgås". That's incidentally Swedish for a shrimp sandwich, by the way -- very good subject matter indeed.

And if you hand me your platform/browser combination and the its success/failure status for the tests, I'll try to update the post accordingly.

Categories:

Saturday, October 25, 2014

mysql allow remoe access

Solution:

When you have completed the installation of the MySQL into the server. You can run this command:

GRANT ALL PRIVILEGES ON *.* TO 'USERNAME'@'IP' IDENTIFIED BY 'PASSWORD';

Username - is the account you wish to create or use.

IP - is the physical IP address of the computer you wish to grant remote access to. [note: if you enter '%' instead of an IP address, that user will be able to remote into MySQL from any computer]

Password - is the password you wish to create if it’s a new user or the existing password of an existing account.

Once the command is sent and completed you must run this command afterward:

FLUSH PRIVILEGES;

Thursday, October 16, 2014

jqwidgets: Grid Cells Formatting

http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-cellsformatting.htm

jqxGrid

The cellsformat property can be used for applying a formatting to the cell values. In the code example below is illustrated how to apply a custom formatting to a column with Date values and to a column with Numeric values.

Js
$("#jqxgrid").jqxGrid(  
{  
    width: 670,  
    height: 450,  
    source: source,  
    theme: theme,  
    sortable: true,  
    columns: [  
        { text: 'Ship Name', datafield: 'ShipName', width: 250 },  
        { text: 'Shipped Date', datafield: 'ShippedDate', width: 230, cellsformat: 'D' },  
        { text: 'Freight', datafield: 'Freight', width: 130, cellsformat: 'F2', cellsalign: 'right' },  
        { text: 'Ship Address', datafield: 'ShipAddress', width: 350 },  
        { text: 'Ship City', datafield: 'ShipCity', width: 100 },  
        { text: 'Ship Country', datafield: 'ShipCountry', width: 100 }  
    ]  
});  

Number format strings:
"d" - decimal numbers.
"f" - floating-point numbers.
"n" - integer numbers.
"c" - currency numbers.
"p" - percentage numbers.

For adding decimal places to the numbers, add a number after the formatting string.
For example: "c3" displays a number in this format $25.256
Built-in Date formats:

// short date pattern
"d" - "M/d/yyyy",
// long date pattern
"D" - "dddd, MMMM dd, yyyy",
// short time pattern
"t" - "h:mm tt",
// long time pattern
"T" - "h:mm:ss tt",
// long date, short time pattern
"f" - "dddd, MMMM dd, yyyy h:mm tt",
// long date, long time pattern
"F" - "dddd, MMMM dd, yyyy h:mm:ss tt",
// month/day pattern
"M" - "MMMM dd",
// month/year pattern
"Y" - "yyyy MMMM",
// S is a sortable format that does not vary by culture
"S" - "yyyy\u0027-\u0027MM\u0027-\u0027dd\u0027T\u0027HH\u0027:\u0027mm\u0027:\u0027ss"

Date format strings:

"d"-the day of the month;
"dd"-the day of the month;
"ddd"-the abbreviated name of the day of the week;
"dddd"- the full name of the day of the week;
"h"-the hour, using a 12-hour clock from 1 to 12;
"hh"-the hour, using a 12-hour clock from 01 to 12;
"H"-the hour, using a 24-hour clock from 0 to 23;
"HH"- the hour, using a 24-hour clock from 00 to 23;
"m"-the minute, from 0 through 59;
"mm"-the minutes,from 00 though59;
"M"- the month, from 1 through 12;
"MM"- the month, from 01 through 12;
"MMM"-the abbreviated name of the month;
"MMMM"-the full name of the month;
"s"-the second, from 0 through 59;
"ss"-the second, from 00 through 59;
"t"- the first character of the AM/PM designator;
"tt"-the AM/PM designator;
"y"- the year, from 0 to 99;
"yy"- the year, from 00 to 99;
"yyy"-the year, with a minimum of three digits;
"yyyy"-the year as a four-digit number;
"yyyyy"-the year as a four-digit number.
Grid Cells Formatting Sample

Js
$("#jqxgrid").jqxGrid(  
{  
    width: 670,  
    height: 450,  
    source: source,  
    theme: theme,  
    sortable: true,  
    columns: [  
        { text: 'Ship Name', datafield: 'ShipName', width: 250, sortable: false },  
        { text: 'Shipped Date', datafield: 'ShippedDate', width: 230, cellsformat: 'D' },  
        { text: 'Freight', datafield: 'Freight', width: 130, cellsformat: 'F2', cellsalign: 'right' },  
        { text: 'Ship Address', datafield: 'ShipAddress', width: 350 },  
        { text: 'Ship City', datafield: 'ShipCity', width: 100 },  
        { text: 'Ship Country', datafield: 'ShipCountry', width: 100 }  
    ]  
});  