I need to change the above link from
Voucher to special action..
The new link is getting from 'Slink ' in the DB
So how can I change it so the page will be the link provided in 'Slink' and not the default link
$.ajax({
url: '/Newsletter/GetUserOrder?id=' + id,
type: "POST",
dataType: 'json',
data: id,
success: function (response)
{
if (response === "")
{
location.href = '/Newsletter/CardDetails'+ id;
}
else
{
var Bname='';
var itemsQuantity;
var name = '';
var Link="פירוט הטבה"
$.each(response, function (indexInArray, valueOfElement)
{
Bname += '<div class="card col-md-5">' + '<b>' + valueOfElement.shortNameVar + '</b>' + '<br/> ' + valueOfElement.BusnessName + '</div>' + '<br/>' + '<div class="chip">' + "כמות" + valueOfElement.MemberOrderQuntity + '</div>' +
'<b>' + '<div class="flx-aut text-center">' + '' + Link + '' + '<div>';
});
Related
I have added a tinymce button to my tinymce editor.but instead of opening the tinymce default modal (editor.addCommand),I want to open Thickbox with ajax content.I have searched many answers on stackoverflow, but didn't make it out.
Here is my code
(function() {
tinymce.PluginManager.add('smart_event', function( editor, url ) {
var shortcode_tag = 'smart_event';
editor.addCommand('smart_event_panel_popup', function( ui, v ){
var columns = '4';
if(v.columns){
columns = v.columns;
}
var style = '';
if(v.style){
style = v.style;
}
editor.windowManager.open({
title: 'Smart Event Shortcode',
body: [
//...........
],
onsubmit: function(e){
// var scode = '[' + shortcode_tag +' columns="' + e.data.columns + '"' + ' style="' + e.data.style + '"' + ' posts_per_page"'+ e.data.posts_per_page +'"' + ' sortby="'+ e.data.sortby +'"' + ' range="'+ e.data.range +'"' + ' pagination="'+e.data.pagination + '"' +' filters="'+e.data.filters + '"' +']';
editor.insertContent( scode );
}
});
});
editor.addButton('smart_event', {
image: seventadmindata.imagesurl + 'icon.png',
tooltip: 'Insert Smart Event Shortcode',
onclick: function(){
editor.execCommand('smart_event_panel_popup','',{
columns : '4',
style : '1',
});
}
});
});
})();
How can I add Thickbox on click with an ajax callback?
I want to use select2 in my Symfony project but still do not know how to display results. My code for frontend is
$(".js_search").select2({
ajax: {
url: "{{ path('search') }}",
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term, // search term
page: params.page
};
},
processResults: function (data, params) {
console.log(data.items);
params.page = params.page || 1;
return {
results: data.items,
pagination: {
more: (params.page * 30) < data.total_count
}
};
},
cache: true
},
escapeMarkup: function (markup) {
return markup;
}, // let our custom formatter work
minimumInputLength: 1,
templateResult: formatRepo, // omitted for brevity, see the source of this page
templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
});
});
function formatRepo (repo) {
if (repo.loading) return repo.text;
var markup = '<div class="clearfix">' +
'<div class="col-sm-1">' +
'<img src="' + repo.owner.avatar_url + '" style="max-width: 100%" />' +
'</div>' +
'<div clas="col-sm-10">' +
'<div class="clearfix">' +
'<div class="col-sm-6">' + repo.full_name + '</div>' +
'<div class="col-sm-3"><i class="fa fa-code-fork"></i> ' + repo.forks_count + '</div>' +
'<div class="col-sm-2"><i class="fa fa-star"></i> ' + repo.stargazers_count + '</div>' +
'</div>';
if (repo.description) {
markup += '<div>' + repo.description + '</div>';
}
markup += '</div></div>';
return markup;
}
function formatRepoSelection (repo) {
return repo.full_name || repo.text;
}
g
and for the backend
public function searchAction()
{
$response = new Response();
$response->setContent(json_encode(
[
'items' =>
[
'id' => 1,
'text' => 'test'
]
]
));
$response->headers->set('Content-Type', 'application/json');
return $response;
}
I dont know how should $response looks like or how to show returned data in view.
Somebody know the answer ?
I am using this https://select2.github.io/
Your response should be a JSON array with the elements Select2 uses to create the option tags for the dropdown.
In your case the content in the reposnse to your AJAX request would be:
[{"id": 1, "text":"test"}]
Select2 will then update the element identifed by the JQuery Selector $(.js-search) with the options and values in your response.
function Loadtodo(s) {
$.ajax({
type: "POST",
async: true,
url: "Home.aspx/LoadTodo",
data: "{InvitaionID:" + s + "}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
count = response.d.length;
if(count!=0)
count = response.d[0].temp;
for (var i = 0; i < response.d.length; i++) {
if (response.d[i].Ischecked == 'false') {
$('.todo-card').prepend('<div class="todo-task"> ' +
'<input type="checkbox" id=' + response.d[i].checkboxid + ' /> ' +
'<label for=' + response.d[i].checkboxid + '>' + response.d[i].todoitem + ' <span class="todo-remove mdi-action-delete"></span> ' +
'</label> </div> ');
}
else {
$('.todo-card').prepend('<div class="todo-task"> ' +
'<input type="checkbox" id=' + response.d[i].checkboxid + ' checked="yes" /> ' +
'<label for=' + response.d[i].checkboxid + '>' + response.d[i].todoitem + ' <span class="todo-remove mdi-action-delete"></span> ' +
'</label> </div> ');
}
}
},
failure: function (response) {
//alert(response.d);
},
error: function (response) {
}
});
}
This is my ajax code. Which i call on jquery document load. I hosted this application on the IIS server. Getting error Failed to load resource: the server responded with a status of 500 (Internal Server Error).
But it working fine when i run the application on the visual studio development server
I have started using VS2012 (Yes about time). I have a MVC 4 app.
Im making a JSON call to get data from DB to render in html.
But Im getting a 500 Internal Server error I can see in Fiddler.
Im not sure how to debug this because I cant find where to
see the C# exception if that is what the issue is.
So Im calling getRecipe in javascript.
public JsonResult GetRecipe(int rid)
{
var recipe = _rep.GetRecipe(rid);
return Json(recipe, JsonRequestBehavior.AllowGet);
}
My script is
var dataService = new function () {
var serviceBase = '/Recipes/'
getRecipesList = function (callback) {
$.getJSON(serviceBase + 'GetRecipesList', {}, function (data) {
callback(data);
});
};
getRecipe = function (rid, callback) {
$.getJSON(serviceBase + 'GetRecipe', {rid:rid}, function (data) {
callback(data);
});
};
return {
getRecipesList: getRecipesList,
getRecipe: getRecipe
};
} ();
var renderer = new function () {
renderList = function () {
dataService.getRecipesList(renderListDiv);
},
renderListDiv = function (recipes) {
var listDiv = $('#listdiv');
listDiv.html("");
$(recipes).each(function (index) {
var table = '<table>';
table += ('<tr><td><a class="recipeLink" href="#recipeList-' + this.RecipeID + '">' + this.RecipeTitle + '</a></td></tr>');
table += '</table>';
listDiv.append(table);
});
},
selectedRecipe = function (anchor) {
var href = $(this).attr("href");
var rid = href.split("-")[1];
dataService.getRecipe(rid, renderRecipe);
};
renderRecipe = function (recipe) {
var recipeDiv = $('#recipediv');
var html = '<h1>' + recipe.RecipeTitle + ' (' + recipe.RecipeID + ')</h1>';
html += '<h4>Preparation Time: ' + getTimeString(recipe.PrepTime) + '</h4>';
html += '<h4>Cooking Time: ' + getTimeString(recipe.CookTime) + '</h4>';
var count = recipe.Ings.length;
var colmax = Math.ceil(count / 2);
var colleft = 0;
var colright = colmax;
html += '</br><table id="ingredientstable">';
for (colleft = 0; colleft < colmax; colleft++) {
html += '<tr>';
html += '<td>' + recipe.Ingredients[colleft].Units + ' ' + recipe.Ingredients[colleft].Measure + ' ' + recipe.Ingredients[colleft].IngredientName + '</td>';
if(colright < count)
html += '<td>' + recipe.Ingredients[colright].Units + ' ' + recipe.Ingredients[colright].Measure + ' ' + recipe.Ingredients[colright].IngredientName + '</td>';
colright += 1;
html += '</tr>';
}
html += '</table>';
html += '<h4>Method</h4>';
html += '<p>' + recipe.Method + '</p>';
recipeDiv.html(html);
numingredients = 0;
editorForm.loadEditor(recipe);
};
clearRecipe = function () {
$('#recipediv').html("");
};
getTimeString = function (time) {
if (time < 60)
return time + ' min';
return time / 60 + ' hours'
};
changeFont = function () {
$('body').css("font-family", "Comic Sans MS");
};
return {
renderList: renderList,
selectedRecipe: selectedRecipe,
changeFont: changeFont,
clearRecipe: clearRecipe,
};
}();
The browser's developer tools might be a good place to get some additional information. In Chrome you can press F12 to bring up the dev tools window. Click on the network tab and then fire off your ajax call. You will see the failed request highlighted in red. If you click on it you will see the error that has been returned from mvc.
I have provided a screenshot in this question: Ajax call with a 'failed to load resource : the server responded with a status of 500'
I have a JQuery and AJAX function that creates a table with 2 list boxes and buttons to add/remove from one list box to another. I want to insert this table into the Edit Dialog box of the JQGrid. So that when the add or edit button is clicked the table displays and the user can add items and the corresponding cell is edited.
Java script and AJAX:
function create_listbox() {
var html = '<select id="ddlRoles" size="7" multiple></select>';
var selected = '<select id="ddlSelectedRoles" size="7" multiple></select>';
var table = '<table id="table1" border="3"></table>';
var tr = '<tr id="tr1"></tr>';
var td1 = '<td id="td1"></td>';
var td2 = '<td id="td2"></td>';
var td3 = '<td id="td3"></td>';
var addButton = '<button id="add" onclick="addRole()">Add Role</button><br>';
var removeButton = '<button onclick="removeRole()">Remove Role</button><br>';
$('#whatever').append(table);
$('#table1').append(tr);
$('#tr1').append(td1);
$('#tr1').append(td2);
$('#tr1').append(td3);
$('#td1').append(html);
$('#td2').append(addButton);
$('#td2').append(removeButton);
$('#td3').append(selected);
$.ajax({
url: "MyApplication.asmx/GetRoles",
data: "{ }",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function (data) { return data; },
success: function (data) {
// alert(data.d);
for (var i = 0; i < data.d.length; i++) {
$('#ddlRoles').append("<option value=\"" + data.d[i].RoleID + "\">" + data.d[i].RoleName + "</option>")
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus + ":" + errorThrown);
}
});
}
I know that I need an EditTypeCustomElement and EditTypeGetCustomValue but I am completely stumped as to how to accomplish this.
I've tried returning $table.get(0) with the create_listbox function which adds a table but it doesn't add the child elements. Any help?
You need a EditTypeCustomElement (below) JQuery and Ajax:
function create_listbox(value, options) {
var htmlRolesDdl = '';
var htmlRolesSelectedDdl = '';
$.ajax({
url: "MyApp.asmx/GetRoles",
data: "{ }",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function (data) { return data; },
success: function (data) {
var roles = new Array();
if (value.toString().match(',') == null) roles.push(value.toString());
else roles = value.toString().split(",")
for (var i = 0; i < data.d.length; i++) {
var isMatch = false;
for (var j = 0; j < roles.length; j++) {
if (data.d[i].RoleName == roles[j].toString()) {
htmlRolesSelectedDdl += "<option id=\"option" + data.d[i].RoleID + "\"" + " value=\"" + data.d[i].RoleID + "\">" + data.d[i].RoleName + "</option>";
//$selected.append("<option id=\"option" + data.d[i].RoleID + "\"" + " value=\"" + data.d[i].RoleID + "\">" + data.d[i].RoleName + "</option>")
isMatch = true;
}
}
if (!isMatch) {
htmlRolesDdl += "<option id=\"option" + data.d[i].RoleID + "\"" + " value=\"" + data.d[i].RoleID + "\">" + data.d[i].RoleName + "</option>"
//$listbox.append("<option id=\"option" + data.d[i].RoleID + "\"" + " value=\"" + data.d[i].RoleID + "\">" + data.d[i].RoleName + "</option>")
}
}
},
async: false,
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus + ":" + errorThrown);
}
});
var html = '<table id="UserRole" border="0">';
html += '<tr>';
html += '<td>';
html += '<select id="ddlRoles" size="7" multiple width="155" style="width:155px;">';
html += htmlRolesDdl;
html += '</select>';
html += '</td>';
html += '<td>';
html += '<button onclick="addRole()" style="width:100px;"> Add >></button><br>';
html += '<button onclick="removeRole()" style="width:100px;"><< Remove</button><br>';
html += '</td>';
html += '<td>';
html += '<select class="ListBoxStyle" id="ddlSelectedRoles" size="7" width="155" multiple style="width:155px;">';
html += htmlRolesSelectedDdl;
html += '</select>';
html += '</td>';
html += '</tr>';
html += '<tr>';
html += '<td colspan="3" align="center" style="padding-top:5px;padding-bottom:10px;">';
html += '(Press and Hold "Ctrl" to select multiple roles)';
html += '</td>';
html += '</tr>';
html += '</table>';
return $(html);
}
and a EditTypeGetCustomValue (below) JQuery and AJAX:
function listbox_value(elem, type, stringvalue) {
if (type == 'get') {
var roles = new Array();
$("#ddlSelectedRoles > option").each(function () {
roles.push($(this).val().toString());
});
return roles.toString();
} else if (type == 'set') {
var roles = new Array();
$("#ddlSelectedRoles > option").each(function () {
roles.push($(this).val().toString());
});
$("#<%= hdnSelectedRoles.ClientID %>").val(roles);
return roles.toString();
}
}