ajax call pass javascript variable in rails 3 - ruby-on-rails-3

<script> var depart_date='11 February 2013';
var depart_date='21 February 2013';
jQuery.ajax({
data: { depart: depart_date, return_date: return_date},
type: 'post',
url: "/payment/create",
});
This is my ajax call.
In terminal it's value getting as {"depart"=>"11 February 2013", "return_date"=>"21 February 2013"}
But in controller params[:depart] & params[:return_date] shows as nil value.
Don't know where i am doing mistake..

Change depart_date to return_date and end the script at the end as:
<script>
var depart_date='11 February 2013';
var return_date='21 February 2013';
jQuery.ajax({
data: { depart: depart_date, return_date: return_date},
type: 'post',
url: "/payment/create",
});
</script>

Related

Error Ajxa call in asp.net xhr.send( options.hasContent && options.data || null )

I tried to so hard to solve it but couldn't.
I got error
xhr.send( options.hasContent && options.data || null )
while saving data this error shows in Jquery.js.
Code is working perfectly in debug mode in vs 2022. I can save data in debug mode. But when
I compile (Publish) this project. I hosted in IIS and every things working perfectly but not in this form When I try to post data then I got same error.
I tried to send header but not working..
var token =
$('input:hidden[name="__RequestVerificationToken"]').val();
headers: { RequestVerificationToken: token },
var detailsList = new Array();
var detailsObj = new Object();
$("#tblDropItem tbody tr").each(function () {
let row = $(this);
let itemId = Number(row.find('.item_detl').attr('purItem_id'));
detailsObj = {
ItemId: itemId,
ItemName: row.find(".item_detl").val(),
Quantity: parseFloat(row.find(".quantity_detl").val()),
UnitId: Number(row.find('.unit_detl').attr('unit_id')),
Rate: parseFloat(row.find(".rate_detl").val()),
Amount: parseFloat(row.find(".amount_detl").val()),
}
if (detailsObj.ItemName) {
detailsList.push(detailsObj);
}
});
var postData = {
PurMode: $("#PurMode").val(),
PurDate: $("#PurDate").val(),
SupId: $("#SupId option:selected").val(),
SubAmount: parseFloat($("#SubAmount").val()),
Discount: parseFloat($("#DiscountPercent").val()),
DiscountAmount: parseFloat($("#Discount").val()),
TotalAmount: parseFloat($("#TotalAmount").val()),
Remarks: $("#Remarks").val(),
Taxable: parseFloat($("#Taxable").val()),
VatAmount: parseFloat($("#VatAmount").val()),
VATable: parseFloat($("#VATable option:selected").val())
PurchaseDetailItemList: detailsList,
__RequestVerificationToken: $("input[name=__RequestVerificationToken]").val(),
}
$.ajax({
type: "POST",
url: "/Purchase/SavePurchase",
dataType: 'JSON',
data: postData,
async:false,
success: function (result) {
toastr.success('Data Saved Successfully');
window.location = "#Url.Content("~/Purchase/Index")";
},
error: function (result) {
toastr.error("Cann't Save Data.");
}
});
[HttpPost]
[ValidateAntiForgeryToken]
public JsonResult SavePurchase(PurchaseDTO model)
{
if (!ModelState.IsValid)
{
return Json("error");
}
//code...
}
Can you please suggest any mistake..
Everything is correct, maybe you have hosted incorrectly in iis, make sure your post url is valid in console.

I can't get “Find time entries for user on workspace” using clockify API

I will try to Gets a time entry by using start date and end date for the specified user on the workspace in clockify
and I'm trying to use the following API endpoint to get the user:
How to get time entry for the specified user using this endpoint?
<script>
$.ajax({
url:'https://api.clockify.me/api/workspaces/5ce55d0df15c986c490dbd31/user/5cecc6b
9d278ae5b59628763/time-entries',
method: 'GET',
contentType: "application/json",
headers: {
'X-Api-Key': 'XRyd+5AH7VhhP+I8'
},
data: JSON.stringify({
start: "2019-07-16T13:00:37Z",
end: "2019-07-16T14:01:41Z"
}),
success: function(data, textStatus, request){
obj = JSON.parse(JSON.stringify(request))
//obj = JSON.parse(request);
//console.log(request);
console.log(obj.responseJSON);
document.getElementById("demo").innerHTML = txt;
},
error: function (request, textStatus, errorThrown) {
console.log("Error");
},
always: function(r) {
console.log(r);
alert(r);
}
});
</script>
{
"timestamp": "2019-07-18T05:42:25.577+0000",
"status": 404,
"error": "Not Found",`enter code here`
"message": "No message availabl",
"path": "/workspaces/5ce55d0df15c986c490dbd31/user/5cecc6b9d278ae5b59628763/time-entries"
}
It's because their API documentation is wrong.
The right endpoint is:
https://api.clockify.me/api//workspaces/workspaceId/timeEntries/user/userId/
Can you point out how and where you are specifying the user name?
Also, refer following code snippet where you can set start and end time before request. And store them in an environment variable.
//Getting current TS
var timestampHeader = new Date().getTime();
console.log("Current Time for event is -> "+timestampHeader);
pm.environment.set("currentTime",timestampHeader);
//Getting old TS
var date = new Date();
date.setTime(date.getTime() - 7.884e+9);
console.log("Old Time for event Is : "+date.getTime());
pm.environment.set("oldTime", date.getTime());
Similarly, you can store a User name in Environment Variable.
To Store values in environement variable:
pm.environement.set("variable_name", variable_value);
To get the value of a variable:
pm.environement.get("variable_name");
So, you an do like follow:
Set Start Time, End Time and User values in environment variable using Pre-request Script
Eg.
pm.environement.set("start_time","start time value");
pm.environement.set("end_time","endtime value");
pm.environement.set("user","user value");
In request body pass above values
like,
{{start__time}}
{{end_time}}
{{user}}

Vue.filter is not calling while HTML rendering

I am new to Vue.js
While rendering the html, I am invoking a Vue.filter. It should show a date in another format.
Below is my js file :
var details = new Vue({
el: '#ajax-article-detail',
data: {
message: 'Hello Vue.js!'
},
methods: {
showName: function() {
console.log('Calling showName...');
return 'Im Event';
}
}
});
Vue.filter('parseDate', function(date, format) {
if (date) {
//console.log(moment(String(date)).format(format));
return moment(String(date)).format(format);
}
});
and in html, I am calling like {{${start_date} | parseDate('ddd, Do MMM YYYY')}}
and as a response, I am getting same statement.
means, I am getting {{${start_date} | parseDate('ddd, Do MMM YYYY')}} as it is in html.
Can anyone please suggest what I did wrong ?
Thank you.
I have changed your code by adding the filter property within the Vue component creation.
var details = new Vue({
el: '#ajax-article-detail',
data: {
message: 'Hello Vue.js!'
},
methods: {
showName: function() {
console.log('Calling showName...');
return 'Im Event';
}
},
filters: {
parseDate: function(date, format) {
console.log('value passed: ' + date); //check the browser console if it is passed
if (date) {
//console.log(moment(String(date)).format(format));
return moment(String(date)).format(format);
}
}
});
Then use the filter like this-
{{2018-12-19 16:46:00 | parseDate('<your_date_format>') }}
However, you need to check if you are passing the value correctly. Try passing some hard coded string value first and check the console window.

Knockout-Kendo Chart - remove and add series

My project is MVC 5, I am using the following to generate a chart with multiple series:
HTML:
<button data-bind="click: addItem">Add</button>
<button data-bind="click: removeItem">Remove</button>
<div data-bind="kendoChart2: { title: { text: 'Graph Sample' },
series: seriesConfig,tooltip: {visible: true,template: '#= series.name #: #= value #'} , seriesDefaults: {
type: 'line',style: 'smooth'}}"> </div>
Javascript
var MainViewModel = function () {
var self = this;
this.Systolic = ko.observableArray([]);
this.Diastolic = ko.observableArray([]);
this.HeartRate= ko.observableArray([]);
$.ajax({
type: "GET",
url: '/Charts/GetChart',
contentType: "application/json; charset=utf-8",
async: false,
cache: false,
dataType: "json",
success: function (result) {
//Diastolic
if (result && result.Systolic.length > 0) {
for (var i = 0; i < result.Systolic.length; i++) {
self.Systolic.push(result.Systolic[i].Systolic);
}
};
....
},
error: function (err) {
alert(err.status + " : " + err.statusText);
}});
this.seriesConfig = ko.observableArray([
{name: "Systolic", data: this.Systolic()},
{name: "Diastolic",data: this.Diastolic()}]);
this.addItem = function() {
this.seriesConfig.push({ name: "Heart Rate", data: this.HeartRate() });
};
this.removeItem = function() {
this.seriesConfig.remove({ name: "Diastolic", data: this.Diastolic() });
};
}.bind(this);
ko.kendo.bindingFactory.createBinding(
{
name: "kendoChart",
bindingName: "kendoChart2",
watch: {
data: function(value) {
ko.kendo.setDataSource(this, value);
},
series: function(value) {
this._sourceSeries = value;
this.refresh();
this.redraw();}
}
});
window.viewModel = new MainViewModel();
ko.applyBindings(window.viewModel);
The chart works great, however can't add or remove series?
Note:
the addItem works, I get the value of the new series:
series: function (value) {
alert(value[2].name);
this.seriesConfig = value;
this.refresh();
this.redraw();
}
I also tried load all series then use the following hide a series:
$("#kendoChart").getKendoChart().options.series[1].visible = false;
$("#kendoChart").getKendoChart().redraw();
Does not work, I think the chart name does not register.
I am not familiar with knockout-kendo, just with knockout in general, so if fixing obvious problem as described below will not work, you might need to refresh bindings. Looking at this example however this is not needed, so most likely you got caught by a simple fact that array's remove performs simple == comparison and it fails to find equal object in the array.
Here is a simplified example (although you might know it already, but just in case):
var a="abc";
var b="abc";
var aa = [1,2,3,"a","b","c"];
var data1 = {name: a, data: aa};
var data2 = {name: b, data: aa};
now, comparison a==b returns true and clearly data slots are the same, however data1==data2 is false. That is because it's a different object.
So in your example in removeItem you create and pass a new object to remove, not the one in the array, so == comparison fails and nothing is removed as that newly created object isn't in your observable array.
I suggest comparing the name only similar to item.age < 18 comparison from knockout.js documentation on observable arrays:
this.seriesConfig.remove( function (item) { return item.name == "Diastolic"; } )
I believe, this should do the trick.

How to load message in real time to a viewer in MVC 4 framework

I'm creating a MVC 4 .NET/C# project to do data loading automatically. When insert new record to database, I want to display a line of message in the viewer in real time. So it would be something like
Record 1 has been loaded successfully!
Record 2 has been loaded successfully!
Record 3 has been loaded successfully!
Record 4 has been loaded successfully!
....
Is there a way to do this?
Thank you for any idea.
Of course. First at all you should write a method which returns numer of records. On the loading page you can use that method to receive number of records f.ex:
Controller:
public ActionResult CountRecords()
{
int records = repository.CountRecords();
return JavaScript(SimpleJsonSerializer.Serialize(records.ToString());
}
public ActionResult LoadRecord(int number)
{
repository.LoadRecord(number);
return JavaScript(SimpleJsonSerializer.Serialize("Success");
}
.cshtml
<script type="text/javascript">
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "#Url.Action("CountRecords", "Controller")",
success: function (response) {
var rows = response.replace('\"', '');
for (i = 1; i <= rows; i++)
{
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: i,
url: "#Url.Action("LoadRecord", "Controller")",
success: function (response) {
var status = response.replace('\"', '');
if (status == 'Success')
$('.messages').append('Record ' + i + ' has been loaded successfully!');
}
});
}
}
});
</script>
Of course it would take more time than in 1 call to controller, but it will works. I don't know if there is possibility to make realtime interface without calling controller many times.
Saving items can be done same as loading.
Regards.