Here is my totally code:-
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
var xml;
$.get(
"xml_converted.xml",
null,
function (data) {
xml = data;
},
"xml"
);
function get_node(ls)
{
var elName = $('#select').val();
var value = $('#value').val();
var xPath = '//*[translate(translate(translate("' + elName + '","-","")," ",""),":","") '+ ls +' translate(translate(translate(#value,"-","")," ",""),":","")]/../../#value';
var iterator = xml.evaluate(xPath, xml.documentElement, null,
XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null);
var thisNode = iterator.iterateNext();
var str = '';
while (thisNode) {
if (str) {
str += ', ';
}
str += thisNode.textContent;
thisNode = iterator.iterateNext();
}
$("#result").text(str);
if (str == null || str == "")
return false;
else
return true;
}
</script>
</head>
<body>
<input type="text" id="select">
<input type="text" id="value">
<input type="button" value="Less than" onclick="get_node('>')">
<input type="button" value="Grater than" onclick="get_node('<')">
<input type="button" value="Equal" onclick="get_node('=')">
<div id="result">
</div>
</body>
</html>
This is my xml fiel sample :-
<products>
<product_id value="1">
<tab_id value="351">
<tab_name value="test1"/>
<dist_region value="5,5068,5069"/>
<reg_str_dt value="2013-01-14 20:35:00"/>
<individual_strdt value="2013-01-14 20:35:00"/>
</tab_id>
</product_id>
<product_id value="2">
<tab_id value="352">
<tab_name value="test2"/>
<dist_region value="5,5069,5070"/>
<reg_str_dt value="2013-01-14 20:35:00"/>
<individual_strdt value="2013-01-14 20:35:00"/>
</tab_id>
</product_id>
</productS>
In my xml file I have one tab dist_region_value="5,5069,5070" this type of value for check this I have one xpath:-
var xPath = '//*[contains(concat(#value, ","),"' + elName+ ',")]/../../#value';
and another xpath query is :-
var xPath = '//*[translate(translate(translate("' + elName + '","-","")," ",""),":","") '+ ls +' translate(translate(translate(#value,"-","")," ",""),":","")]/../../#value';
How to set both in one query?
thanks...
How about this:
var xPath = '//*[contains(concat(#value, ","), "' + elNname+ ',") and ' +
' translate("' + elName + '"," -:","") '+ ls +
' translate(#value," -:","")]/../../#value';
as shown here, you don't need to nest multiple translates together, either.
Related
I'm noob with Jquery DataTables.
I have a very basic question on how to use the sorting plugins:
Have googled a lot on this, but I fail to get proper answers, on how to incorporate them in my code, do we have to just add the script to a ".js" file and add it? or Do we also have to call the function of the plugins?
Can someone point me to a working example with sorting of numeric columns formatted with commas/percentage signs.
The columns with signs or commas are sorted as string. I have seen a lot of references which say to use plugins and then specify sType or sSortableDataType but that doesn't work.
Here's my code: (Please correct me where I'm wrong)
<%# Page Language="C#" AutoEventWireup="true" CodeFile="scorecard_dynamic.aspx.cs" Inherits="Dashboard_scorecard_dynamic" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>new score card</title>
<%--<script src="../js/jquery-1.10.2.min.js"></script>--%>
<style type="text/css" title="currentStyle">
#import "../js/datatable/css/demo_page.css";
#import "../js/datatable/css/demo_table.css";
</style>
<script type="text/javascript" src="../js/datatable/js/jquery.js"></script>
<script type="text/javascript" src="../js/datatable/js/jquery.dataTables.js"></script>
<script src="../js/datatable/Plugins-master/sorting/custom-data-source/percent.js"></script>
<link href="../StyleSheet/LoadingPanel.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
gettopchannelsplot();
//transpose();
var otable = $('#example').dataTable({
"iDisplayLength": 5,
"aLengthMenu": [[1, 2, 3, 4, 5], [1, 2, 3, 4, "All"]],
"oLanguage": {
"oPaginate": {
"sPrevious": "Previous", //can change text for pagination
"sNext": "Next"
},
//"fnDrawCallback": function (oSettings) {
// alert('DataTables has redrawn the table');
//},
"aoColumns": [
null,
{ "sType": "pct" },
null,
null,
null,
null,
null,
null
],
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 0,5,6,7 ] }
]
}
//"sPaginationType": "full_numbers"
});
oTable.fnSort([[3, 'asc']]);
});
var StartDate = '16-oct-2013';
var EndDate = '22-oct-2013';
function transpose() {
var t = $('#example tbody').eq(0);
var r = t.find('tr');
var cols = r.length;
var rows = r.eq(0).find('td').length;
var cell, next, tem, i = 0;
var tb = $('<tbody></tbody>');
while (i < rows) {
cell = 0;
tem = $('<tr></tr>');
while (cell < cols) {
next = r.eq(cell++).find('td').eq(0);
tem.append(next);
}
tb.append(tem);
++i;
}
$('#example').append(tb);
$('#example').show();
}
function gettopchannelsplot() {
//$("#bubbling").show();
//alert('gettopchannelsplot');
var arrListMain = new Array();
var arrList = new Array();
var linkName = 'View Chatter';
var result = ExecuteSynchronously('../SocialMedia.asmx', 'GetTopchannels', { startDate: StartDate, endDate: EndDate });
//tbl_example.empty();
$('#example thead').append("<tr>"
+"<td class='normalBold' align='left'>info</td>"
+ "<td class='normalBold' align='left'>share of voice</td>"
+ "<td class='normalBold' align='left'>total chatter</td>"
+ "<td class='normalBold' align='left'>sentiments</td>"
+ "<td class='normalBold' align='left'>exposure</td>"
+ "<td class='normalBold' align='left'>most popular with</td>"
+ "<td class='normalBold' align='left'>most popular on</td>"
+ "<td class='normalBold' align='left'>link</td>"
+ "</tr>");
var value = new Array();
if (result.d != "" && result.d != null) {
arrListMain = result.d.split('#');
for (var i = 0; i < arrListMain.length; i++) {
var tmp = "<tr>"
+ "<td class='border' width='12%'><a href='../Scorecard.aspx?1'><image src='" + "../" + arrListMain[i].split('^')[7] + "'/></a></td>"
+ " <td class='border' width='12%' align='center'>" + arrListMain[i].split('^')[2] + "%</td>"
+ " <td class='border' width='12%' align='center'> " + arrListMain[i].split('^')[3] + "</td>"
//// + " <td class='border' width='12%' align='center'><label id=label" + i + " >" + Number(arrListMain[i].split('^')[3]).toLocaleString() + "</label></td>"
+ " <td class='border' width='12%' align='center'><image src='" + "../" + arrListMain[i].split('^')[10] + "'/></td>"
+ " <td class='border' width='13%' align='center'>" + arrListMain[i].split('^')[5] + "</td>"
+ " <td class='border' width='13%' align='center'><image src='" + "../" + arrListMain[i].split('^')[8] + "'/></td>"
+ " <td class='border' width='13%' align='center'><image src='" + "../" + arrListMain[i].split('^')[9] + "'/></td>"
+ " <td class='border' width='13%' align='center'><a href='../ChatterAdvanced2.aspx?filter=channel&value=" + arrListMain[i].split('^')[0] + "'>chatter</a></td>"
+ "</tr>";
//alert(tmp);
$('#example tbody').append(tmp);
}
}
$("#bubbling").hide();
}
</script>
<script type="text/javascript">
function ExecuteSynchronously(url, method, args) {
var executor = new Sys.Net.XMLHttpSyncExecutor(); // Instantiate a WebRequest.
var request = new Sys.Net.WebRequest(); // Set the request URL.
request.set_url(url + '/' + method); // Set the request verb.
request.set_httpVerb('POST'); // Set request header.
request.get_headers()['Content-Type'] = 'application/json; charset=utf-8'; // Set the executor.
request.set_executor(executor); // Serialize argumente into a JSON string.
request.set_body(Sys.Serialization.JavaScriptSerializer.serialize(args)); // Execute the request.
request.invoke();
if (executor.get_responseAvailable()) {
return (executor.get_object());
}
return (false);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<AjaxToolkit:ToolkitScriptManager runat="server" ID="ASD">
<Scripts>
<asp:ScriptReference Path="~/js/XMLHttpSyncExecutor.js" ScriptMode="Release" />
<asp:ScriptReference Path="~/App_Code/SocialMedia.cs" />
</Scripts>
</AjaxToolkit:ToolkitScriptManager>
<div>
<div class="bubblingG" id="bubbling">
<span id="bubblingG_1"></span>
<span id="bubblingG_2"></span>
<span id="bubblingG_3"></span>
</div>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
</thead>
<tbody>
</tbody>
</table>
</div>
</form>
</body>
</html>
Please excuse my HTML markup formatting.
You need both the "plugin" and set the proper sType according to that plugin. The plugins are really just some very simple functions, that you easily can produce yourself for your own needs and place into your code. Consider this "plugin" that sort percents with commas :
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"normalize": function(n) {
return parseFloat(n.toString().replace(',','.'));
},
"percent-asc": function(a, b) {
a=this.normalize(a);
b=this.normalize(b);
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"percent-desc": function(a, b) {
a=this.normalize(a);
b=this.normalize(b);
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
});
The above is pretty failsafe. To initialize :
var dataTable = $('#example').dataTable({
aoColumns: [
null,
null,
null,
{ sType: "percent" },
null
],
//...
});
see this working fiddle demonstrating the code above -> http://jsfiddle.net/xK7Ud/
I have a controller function which is called by jquery:
function get_sku_prices(){
$this->load->model('Sales_model');
if (isset($_GET['term'])){
$q = strtolower($_GET['term']);
$this->Sales_model->get_sku_price($q);
}
}
The model, get_sku_price is:
function get_sku_price($q){
$this->db->select('price');
$this->db->where('sku', $q);
$query = $this->db->get('products');
if($query->num_rows > 0){
foreach ($query->result_array() as $row){
$row_set[] = htmlentities(stripslashes($row['price'])); //build an array
}
$this->output->set_content_type('application/json')->set_output(json_encode($row_set));
}
}
what I want, is to return the result of the above query(which is essentially select price from products where sku=36113) to the input variable 'price' on my view form.
My view syntax is:
<html>
<head>
<title>
Capture blank Order
</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="<?php echo base_url() ?>css/sales.css" />
<script type="text/javascript">
function callAutocomplete(element)
{
$(element).autocomplete(
{
source: "sales/get_sku_codes",
messages:
{
noResults: '',
results: function() {}
},
select: function( event, ui )
{
var selectedObj = ui.item;
$.post('sales/get_sku_prices', {data:selectedObj.value},function(result) {
$(ui).parent('tr').find('input[id^="pricepercube"]').val(result);
});
}
});
}
$(function()
{
var counter = 1;
jQuery("table.authors-list").on('change','input[name^="qty"]',function(event)
{
event.preventDefault();
counter++;
var newRow = jQuery('<tr>'+
' <td><a class="deleteRow"> x </a></td>' +
' <td><input type="text" id="product' + counter + '" name="product' + counter + '" /></td>' +
' <td><input type="text" id="qty' + counter + '" name="qty' + counter + '" /></td>'+
' <td><input type="text" id="price' + counter + '" name="price' + counter + '" /></td>'+
' <td><input type="text" id="discount' + counter + '" name="discount' + counter + '" /></td>'+
' <td valign=top><input type="checkbox" id="treated' + counter + '" name="treated' + counter + '" /></td>'+
' </tr>');
jQuery('table.authors-list').append(newRow);
callAutocomplete("#product"+ counter);
});
$("#product").autocomplete(
{
source: "sales/get_sku_codes",
messages:
{
noResults: '',
results: function() {}
},
select: function( event, ui )
{
var selectedObj = ui.item;
$.post('<?=site_url("sales/get_sku_prices")?>', {data:selectedObj.value},function(result)
{
$("#price").val(result);
});
}
});
});
</script>
</head>
<body>
<table class="authors-list" border=0>
<tr><td></td><td>Product</td><td>Qty</td><td>Price/Cube</td><td>Discount</td><td>treated</td></tr>
<tr>
<td><a class="deleteRow"> x </a></td>
<td><input type="text" id="product" name="product" /></td>
<td><input type="text" id="qty" name="qty" /></td>
<td><input type="text" id="price" name="price" /></td>
<td><input type="text" id="discount" name="discount" /></td>
<td valign="top" ><input type="checkbox" id="treated" name="treated" /></td>
</tr>
</table>
</body>
</html>
Firefox returns a 200 OK message. you can see the post information contains the contents of the product input, but the returned HTML is blank?
UPDATE
mysql
post
blank html
is my model query correct? is the post being correctly passed tot he model? how can I verify this?
Thanks again.
You are passing data inside $.post and getting it as term.
Change
if (isset($_GET['term'])){
to
if (isset($_POST['data'])){
You should be outputing your data from the controller, not the model.
Controller:
function get_sku_prices(){
$this->load->model('Sales_model');
if (isset($_GET['term'])){
$q = strtolower($_GET['term']);
$data = $this->Sales_model->get_sku_price($q);
$this->output->set_content_type('application/json')->set_output(json_encode(data));
}
}
Model:
function get_sku_price($q){
$this->db->select('price');
$this->db->where('sku', $q);
$query = $this->db->get('products');
if($query->num_rows > 0){
foreach ($query->result_array() as $row){
$row_set[] = htmlentities(stripslashes($row['price'])); //build an array
}
return $row_set;
}
}
Further to the above, you are passing your data via AJAX as POST data, yet in your controller you are trying to receive data from the GET array.
this is my xml file:-
<results value="1">
<result value="111">
<Country_Code value="IN"/>
<Country_Name value="India"/>
<Region_Name value="Gujarat"/>
<City value="Rajkot"/>
<loction lat="13.060422" lng="80.24958300000003"/>
</result>
<result value="222">
<Country_Code value="KE"/>
<Country_Name value="Kenya"/>
<Region_Name value="Vihiga"/>
<City value="Kakamega"/>
<loction lat="0.1182473" lng="34.7334515999997"/>
</result>
</results>
this is my code:-
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
var xml;
$.get(
"sea.xml",
null,
function (data) {
xml = data;
},
"xml"
);
function get_list(ls) {
var elName = $('#select').val();
var value = $('#value').val();
if(elName == "" || value == "")
{
}
else if (elName != "" || value != "")
{
var xPath = '//*[ #lat '+ ls +' "'+elName+'" and #lng '+ ls +' "'+value+'"]'+'/../City/#*';
var iterator = xml.evaluate(xPath, xml.documentElement, null,
XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null);
var thisNode = iterator.iterateNext();
var str = '';
while (thisNode) {
if (str) {
str += ', ';
}
str += thisNode.textContent;
thisNode = iterator.iterateNext();
}
$("#result").text(str);
}
else
{}
}
</script>
</head>
<body>
<input type="text" id="select">
<input type="text" id="value">
<input type="button" name="button" value="Search" onclick="get_list('=')">
<div id="result">
</div>
</body>
</html>
with this code xpath return attribute value Rajkot but i want to change in Xpath to get all the attribute
with help of xPath if value match on xml file return only city attribute value.
but i want to all attribute value like:- IN,Inida,Gujarat,Rajkot,13.060422,80.24958300000003
The following XPath:
//loction[#lat='13.060422' and #lng='80.24958300000003'][1]/preceding-sibling::City/#value
Outputs:
value="Rajkot"
And the following XPath:
//loction[#lat='13.060422' and #lng='80.24958300000003'][1]/preceding-sibling::*/#*
Outputs:
value="IN"
-----------------------
value="India"
-----------------------
value="Gujarat"
-----------------------
value="Rajkot"
i haved trying to use ajax upload image. here is my code
$(function () {
var btnUpload = $('#post_pd_thumnail');
if ($("#id").val()) var post_id = $("#id").val();
else var post_id = 0;
new AjaxUpload(btnUpload, {
action: site_root_domain + "/product/upload_image/" + post_id,
name: 'file_upload',
onSubmit: function (file, ext) {
if ($('#post_pd_thumnail').val() != '') {
if (!(ext && /^(jpg|png|jpeg|gif)$/.test(ext))) {
jAlert(lang_error_upload_avatar, lang_alert_notice);
return false;
}
}
$('#preview').html('<img style="margin-left:45px;margin-top:45px;" border="0" width="16" height="11" src="' + site_root_domain + '/templates/images/icons/loading_2.gif" />');
},
onComplete: function (file, response) {
if (!response) {
jAlert(lang_error_upload_avatar, lang_alert_notice);
} else {
img_upload = 1;
$('#preview').html(response);
}
return;
}
});
});
And my HTML is:
<div id="preview">{$preview}</div>
<div class="fileupload">
<input type="file" name="post_pd_thumnail" id="post_pd_thumnail" value="" />
</div>
<input type="hidden" name="id" id="id" value="{$data['product']['post_id']}" />
and i got this error when upload image "el is undefined" and the function does not work correctly can anyone help me solve this problem please
Try to change the file element to button like,
<div class="fileupload">
<input type="button" name="post_pd_thumnail" id="post_pd_thumnail" value="" />
</div>
Here is the solution.
* Attaches event to a dom element
*/
function addEvent(el, type, fn){
// 610 BUG
if (el == undefined) return;
if (w.addEventListener){
el.addEventListener(type, fn, false);
} else if (w.attachEvent){
var f = function(){
fn.call(el, w.event);
};
el.attachEvent('on' + type, f)
}
}
I have HTML code as below:
<script type="text/javascript">
$(document).ready(function(){
$("#useDatePicker").mouseout(function{
//$("#result").text() = $("#useDatePicker").text();
alert(1);
});
});
</script>
</head>
<body>
<form method="post" name="frm" id="myForm">
<input type="text" name="date" id="useDatePicker"/>
<input type="text" name="result" id="result" />
</form>
What I need:
when the user select date from date Picker, it will subtract with date now automatic and the result will be in <input type="text" name="result" id="result" />
Problem
I have no concept with it.
may be you can use onselect option of date picker of jquery ui
demo: fiddle
$('#useDatePicker').datepicker({
onSelect: function (date) {
var today = new Date();
var result = DateDiff(today, new Date(date));
$('#result').val(result);
}
});
function DateDiff(date1, date2) {
var diff = date1 - date2;
var num_years = diff / 31536000000;
var num_months = (diff % 31536000000) / 2628000000;
var num_days = ((diff % 31536000000) % 2628000000) / 86400000;
return Math.floor(num_years) + "years " + Math.floor(num_months) + "months " + Math.floor(num_days) + "days";
}