Probably something simple going on here, but I have to attend to it before I attend to the PHP stuff. I'm going to try to use PHPMailer this time.
Also I've been trying to learn how to send a form on localhost for about a week now. Now I'm going to try to to incorporate PHPMailer. I had originally spent some time enabling a sites available to point to another folder, installing and testing PHP and installing msmtp on debian, even sent a test email with PHP, via command line but I haven't gotten one form to submit right yet and it's a :p
Also when working on forms before I made a couple changes to my php.ini files one on apache dir and one on cli dir, I think I uncommented some stuff and I hope it wont interfere with the what I'm trying to do.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Contact</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<style type="text/css">
input, textarea {
margin-top: 10px;
}
</style>
</head>
<body>
<div class="container" style="margin-top:100px;">
<div class="row justify-content-center">
<div class="col-md-6 col-md-offset-3" align="center">
<input id="name" placeholder="Name" class="form-control">
<input id="email" placeholder="Email" class="form-control">
<input id="subject" placeholder="Subject" class="form-control">
<textarea class="form-control" id="body" placeholder="Email Body"></textarea>
<input type="button" onclick="sendEmail()" value="Send an Email" class="btn btn-primary"></type>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script type="text/javascript">
function sendEmail() {
console.log('sending...');
var name = $("#name");
var email = $("#email");
var subject = $("#subject");
var body = $("#body");
if (isNotEmtpy(name) && isNotEmpty(email) && isNotEmpty(subject) && isNotEmpty(body)) {
$.ajax({
url: 'sendEmail.php',
method: 'POST',
dataType: 'json',
data: {
name: name.val(),
email: email.val(),
body: body.val()
}, success: function (response) {
console.log(response)
}
});
}
}
function isNotEmpty(caller) {
if (caller.val()) == "") {
caller.css('border', 1px solid red');
return false;
} else
caller.css('border', '');
return true;
}
</script>
</body>
</html>
RAW Paste Data
Try use code below:
<script type="text/javascript">
function sendEmail() {
console.log('sending...');
var name = $("#name");
var email = $("#email");
var subject = $("#subject");
var body = $("#body");
if (isNotEmpty(name) && isNotEmpty(email) && isNotEmpty(subject) && isNotEmpty(body)) {
$.ajax({
url: 'sendEmail.php',
method: 'POST',
dataType: 'json',
data: {
name: name.val(),
email: email.val(),
body: body.val()
}, success: function (response) {
console.log(response)
}
});
}
}
function isNotEmpty(caller) {
if (caller.val() === "") {
caller.css('border', '1px solid red');
return false;
} else {
caller.css('border', '');
}
return true;
}
</script>
I checked. Work fine.
Related
I am writing a login form and I need to make an authentication for the username and password.
The form is written in dreamweaver html code. And the database is local in visual studio .net core code. I am still trying to figure out a way to use $post and $get methods, but I even can't write the url correctly. I am using swagger to host my api.
Here is my visual studio controller code :
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;
using authentication.Models;
using authentication.Repository;
using Microsoft.AspNetCore.Http;
namespace Taskb.Controllers
{
[Route("api/[controller]")]
[ApiController]
public class UserController : ControllerBase
{
private UsersRepository users = new UsersRepository();
private int count = 0;
[HttpGet]
public ActionResult<IEnumerable<user>> GetAllUser()
{
return users.GetAllUsers();
}
[HttpPost]
public ActionResult<user> CreateUser( user newUser)
{
foreach (user item in users.GetAllUsers())
{
if (newUser.username == item.username && newUser.password == item.password)
{
count++;
}
}
if (count == 0)
{
return StatusCode(StatusCodes.Status500InternalServerError, "Username or password incorrect");
}
return Ok("Authentication Successfull");
}
}
}
And here is my html code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Roy Daher</title>
<link href="styles/style.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="width=device-width, initial scale 1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"
type="text/javascript"></script>
<!--include jQuery Validation Plugin-->
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.min.js"
type="text/javascript"></script>
</head>
<body bgcolor="#F1F1F1" class="body">
<div class="cont" >
<div class="top"></div>
<div class="bottom"></div>
<div class="center">
<form id="form" method="post">
<!--<div class="image">
<img src="images/28-287073_elonlol-discord-emoji-elon-musk-laughing-deer-hd.png" width="282" height="290" alt="Picture" class="elon">
</div>-->
<div class="container">
<label for="user"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="user" required id="userinput">
<label for="pass"><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="pass" required id="passinput">
<button id="loginButton" type="button">Login</button>
<label for="remember">Remember me</label>
<input type="checkbox" checked="checked" name="remember">
</div>
<div class="container" style="background-color:#F1F1F1">
<span class="forgot">Forgot <a href="pages/PassRecovery.html" target="_blank" >password?</a></span>
</div>
</form>
</div>
</div>
</body>
<script>
$(document).ready(function(){
$("button").click(function(){
var inputVal = document.getElementById("userinput").value;
var passVal = document.getElementById("passinput").value;
var obj ={
username:inputVal,
password:passVal
};
console.log(obj);
$.post("https://44332/api/User",
{
},
});
});
});
</script>
</html>
Thank you in advance for your help.
Your post method should use [FromBody] user newUser as the input parameter like below:
[HttpPost]
public ActionResult<user> CreateUser([FromBody] user newUser)
{
List<user> users = new List<user> {
new user{ username="a",password="a"},
new user{ username="b",password="b"},
new user{ username="c",password="c"}
};
foreach (user item in users)
{
if (newUser.username == item.username && newUser.password == item.password)
{
count++;
}
}
if (count == 0)
{
return StatusCode(StatusCodes.Status500InternalServerError, "Username or password incorrect");
}
return Ok("Authentication Successfull");
}
And your ajax request should send like this:
<button id="loginButton">login</button>
<script>
$("#loginButton").click(function(){
var obj ={
username:"a",
password:"a"
};
$.ajax({
url: "https://localhost:44317/api/user",
type: 'post',
contentType: 'application/json',
data: JSON.stringify(obj),
success: function(data) {
alert(data);
}
})
});
</script>
I have a chrome extension that I've set up too ideally log me in to a website. All that is needed is too type in my email, click enter, and type in my password and a number code that appears on the website. I've already created extension options page where I input my email and password so it is saved as a value:
HTML:
<!DOCTYPE html>
<html>
<head><title>Charter Gradebook Helper Options</title></head>
<body>
<div class="header">
<h1>Charter Gradebook Helper Options:</h1>
<p>Change the username and password to login with</p>
</div>
Email:
<label>
<input type="text" id="ema">
</label>
<br>
Password:
<label>
<input type="text" id="pas">
</label>
<div id="status"></div>
<button id="save">Save</button>
<script src="options.js"></script>
</body>
</html>
JS:
function save_options() {
var email = document.getElementById('ema').value;
var password = document.getElementById('pas').value;
chrome.storage.sync.set({
email: ema,
password: pas,
}, function() {
// Update status to let user know options were saved.
var status = document.getElementById('status');
status.textContent = 'Saving...';
setTimeout(function() {
status.textContent = 'Saved successfully!';
}, 750);
});
}
I've created the thing that listens for the correct web page I believe:
// Copyright (c) 2011 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
// When the extension is installed or upgraded ...
chrome.runtime.onInstalled.addListener(function() {
// Replace all rules ...
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
// With a new rule ...
chrome.declarativeContent.onPageChanged.addRules([
{
// That fires when a page's URL contains a 'cdacharter.org/portal/' ...
conditions: [
new chrome.declarativeContent.PageStateMatcher({
pageUrl: { urlEquals: 'https://www.cdacharter.org/portal/' },
})
],
// And shows the extension's page action.
actions: [ new chrome.declarativeContent.ShowPageAction() ]
}
]);
});
});
I just don't know how to make it:
type in my email and hit enter
Type in my password
Copy and paste a code that is shown on screen
(preferably automatically, but if that's not possible I could click the extension if need be)
Here is the first and second page of the website that I am trying to log into
<!-- saved from url=(0034)https://www.cdacharter.org/portal/ -->
<html data-kantu="1"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>CDA Charter Panther Portal</title>
<link rel="stylesheet" type="text/css" href="./First_files/stylesheet.css">
</head>
<body translate="no" data-new-gr-c-s-check-loaded="14.984.0" data-gr-ext-installed="">
<div id="page-wrapper">
<div id="title">
Coeur d'Alene Charter Academy Panther Portal
</div>
<div id="maincontent" style="border-style: none;">
<center>
<table width="50%">
<tbody><tr>
<td align="center">
Email Address:
<input type="text" size="45" maxlength="64" name="email" id="email" onchange="startlogin(this);">
</td>
</tr>
<tr>
<td>
<p> </p><hr><p></p>
To login, enter your email address above and press [Enter]. Students, you will
need to type in your full school-assigned email address. Parents, please note
that we must have your email address on file for this to work.
<p>
You can request a password reset by checking this box
<input type="checkbox" id="passreset" value="1">
and <u>then</u> filling in your email address above and pressing [Enter]. A message
will be emailed to you with a PIN you will need. Note this this will only
work if your email address is on file with our office.
</p><p> </p><hr><p></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
Footnotes: Please allow popup windows and web browser cookies for our web site. The popups
will allow you to see the detailed gradebook reports. The cookies will allow the
security features of this site to pass information unique to you to our server
to correctly identify you and grant you access to your data. The cookie is simply
a random string stored by your browser and has no other information imbedded in it
that could identify you nor does it have any information about you covertly taken
from your computer.
<p>
</p></td>
</tr>
</tbody></table>
</center>
</div>
</div>
<script src="./First_files/jquery-3.2.1.js"></script>
<script language="javascript">
function validateEmail(email)
{
var re = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")#(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
return(re.test(email));
}
function startlogin(obj)
{
if (validateEmail(obj.value))
{
var email = obj.value;
}
else
{
alert("Email address does not appear to be in a valid format.");
obj.focus();
return;
}
if (document.getElementById("passreset").checked)
var nextstep = "passreset.php";
else
var nextstep = "startlogin.php";
$("#maincontent").html("<center><p> </p><p> </p><p><i>Generating a random PIN...</i></p></center>");
$.ajax( {
type: "POST",
url: nextstep,
data: "email=" + email,
dataType: "html"
})
.done (function(data) {
$("#maincontent").html(data);
$("#maincontent").focus();
})
.fail ( function(data) {
alert('Login system error.');
});
return;
}
</script>
</body></html>
Second:
<!-- saved from url=(0034)https://www.cdacharter.org/portal/ -->
<html data-kantu="1"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>CDA Charter Panther Portal</title>
<link rel="stylesheet" type="text/css" href="./CDA Charter Panther Portal_files/stylesheet.css">
</head>
<body translate="no" data-new-gr-c-s-check-loaded="14.984.0" data-gr-ext-installed="">
<div id="page-wrapper">
<div id="title">
Coeur d'Alene Charter Academy Panther Portal
</div>
<div id="maincontent" style="border-style: none;">
If/when we go to 2-step authentication, you will need your password <u>and</u> a random PIN<br>(<i>which will be emailed or texted to you</i>) to login. For now, we'll just show you the PIN here.<br> <b>40321</b> <br>Use this to complete the login below.<br><p>Student Login Initiated</p><form method="POST" id="completeloginform"><table align="center"><input type="hidden" name="cdacaemail" value="macdun24#cdapanthers.org"><tbody><tr><td>PIN:</td><td><input autocomplete="off" type="text" name="cdacapinnum" size="32" maxlength="5" value="" style="text-align:center;"></td></tr><tr><td>Password:</td><td><input autocomplete="off" type="password" name="cdacapass" size="32" maxlength="32" value="" style="text-align:center;"></td></tr><tr><td></td><td align="center"><input type="button" value=" Login " onclick="completelogin();"></td></tr></tbody></table></form><p></p><script language="javascript">
function completelogin()
{
var cdacaemail = document.getElementById("completeloginform").elements.namedItem("cdacaemail").value;
var cdacapinnum = document.getElementById("completeloginform").elements.namedItem("cdacapinnum").value;
var cdacapass = document.getElementById("completeloginform").elements.namedItem("cdacapass").value;
$("#maincontent").html("<center><p> </p><p> </p><p><i>Verifying credentials...</i></p></center>");
$.ajax( {
type: "POST",
url: 'startlogin.php',
data: "cdacaemail=" + cdacaemail + "&cdacapinnum=" + cdacapinnum + "&cdacapass=" + cdacapass,
dataType: "html"
})
.done (function(data) {
$("#maincontent").html(data);
$("#maincontent").focus();
})
.fail ( function(data) {
alert('Login system error..');
});
return;
}
function openemup()
{
document.getElementById("completeloginform").elements.namedItem("cdacapinnum").disabled = false;
document.getElementById("completeloginform").elements.namedItem("cdacapass").disabled = false;
document.getElementById("completeloginform").elements.namedItem("cdacapinnum").focus();
return(1);
}
timerID = setTimeout('openemup();',1000);
</script>
</div>
</div>
<script src="./CDA Charter Panther Portal_files/jquery-3.2.1.js"></script>
<script language="javascript">
function validateEmail(email)
{
var re = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")#(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
return(re.test(email));
}
function startlogin(obj)
{
if (validateEmail(obj.value))
{
var email = obj.value;
}
else
{
alert("Email address does not appear to be in a valid format.");
obj.focus();
return;
}
if (document.getElementById("passreset").checked)
var nextstep = "passreset.php";
else
var nextstep = "startlogin.php";
$("#maincontent").html("<center><p> </p><p> </p><p><i>Generating a random PIN...</i></p></center>");
$.ajax( {
type: "POST",
url: nextstep,
data: "email=" + email,
dataType: "html"
})
.done (function(data) {
$("#maincontent").html(data);
$("#maincontent").focus();
})
.fail ( function(data) {
alert('Login system error.');
});
return;
}
</script>
</body></html>
I am sending pdf file to server, and the form for creation of pdf file is not rendered, when the page loads. Its rendered when user click on something...
The problem is, that I cannot select id "file" which is input type="file" (html is generated by javascript).
How to select it the same as I am doing it with this code (the same result).
Thank you
$('.content').on('click','.file-btn', function() {
var data = new FormData();
var input = document.getElementById('file');
const title = $("#title").val();
const description = $("#textarea").val();
const sharingWith = $("#dropdown").val();
data.append('file', input.files[0]);
console.log("file" + data.get("file"));
$.ajax({
method: 'POST',
enctype: 'multipart/form-data',
url: 'https://localhost:8443/documents'+ "?title="+title + "&desc="+description + "&Role="+sharingWith ,
data: data,
processData: false,
contentType: false,
headers: {
'Authorization': 'bearer ' + localStorage.access_token},
success: function (data) {
alert("works!");
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
})
export const createDocumentForm = () => {
const markup = `<form class="doc_form" id="doc-form">
<label for="title" id="title-label">Title</label>
<input type="text" id="title" required placeholder="Title">
<label for="textarea" id="textarea-label">Description</label>
<textarea id="textarea" placeholder="Enter description" required rows="5"></textarea>
<label for="dropdown" id="dropdown-label">Select groups for sharing document</label>
<select name="select" id="dropdown" multiple required>
<option value="USER">USER</option>
<option value="SUPERIOR">SUPERIOR</option>
<option value="ADMIN">ADMIN</option>
</select>
<div class="doc_sender">
<form class="form-horizontal" method="POST" enctype="multipart/form-data" id="id_form">
<input type="file" id="file"/>
</form>
<button class="btn btn-doc file-btn">Save file!</button>
</div>
</form>`;
elements.content.insertAdjacentHTML("beforeend", markup);
};
try using this to get your file
var input = $("#file").get(0).files[0];
1st: be sure your html file you have the main.js is below the src of jQuery src
2nd: wrap your js code like the example below
$(document).ready(function() {
console.log('your document is ready ...');
// your code ....
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet"
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="main.js"></script>
<title>Your title</title>
</head>
<body>
</body>
</html>
I have a javascript code that I have hardcoded into my html file, but it never seems to load. My form sends data to a php file via post immediately without every going through javascript verification. Any ideas? Thanks!
<!DOCTYPE html>
<html>
<head>
<!-- Stylesheets - boostrap and get-shit-done, a free UI -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="styelsheet" type="text/css" href="css/get-shit-done.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<h1>Registration</h1>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$('#registration').on('submit', function(e){
var usernameValue = $("#username").val();
var passwordValue = $("#password").val();
var confirmationValue = $("#confirmation").val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'username1='+ usernameValue + '&password1='+ passwordValue + '&confirmation1='+ confirmationValue;
if(usernameValue==''||passwordValue==''||confirmationValue=='') {
alert("Please Fill All Fields");
}
else {
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "register.php",
data: dataString,
cache: false,
success: function(result){
alert(result);
}
});
}
return false;
});
</script>
</head>
<body>
<form id ="registration" action="register.php" method="post">
<fieldset>
<legend>Registration Details</legend>
<form class="form-inline">
<div class="form-group">
<input autocomplete="off" autofocus class="form-control" id="username" placeholder="Username" type="text"/>
</div>
<div class="form-group">
<input class="form-control" id="password" placeholder="Password" type="password"/>
</div>
<div class="form-group">
<input class="form-control" id="confirmation" placeholder="Password" type="password"/>
</div>
<div class="form-group">
<button class="btn btn-default btn-round" type="submit" id="submit">
<span aria-hidden="true" class="glyphicon glyphicon-log-in"></span>
Log In
</button>
</div>
</form>
</fieldset>
</form>
<div>
<p class="text-center">or login</p>
</div>
</body>
</html>
You need to wrap your $('#registration').on('submit', function(e){ }); with in a $(function(){ }); (or $(document).ready()) as it is currently binding before the document is ready -
<script>
$(function(){
$('#registration').on('submit', function(e){
...
[rest of your code]
...
});
});
</script>
Please try adding your script inside jquery document ready . Example
$( document ).ready(function() {
$('#registration').on('submit', function(e){
var usernameValue = $("#username").val();
var passwordValue = $("#password").val();
var confirmationValue = $("#confirmation").val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'username1='+ usernameValue + '&password1='+ passwordValue + '&confirmation1='+ confirmationValue;
if(usernameValue==''||passwordValue==''||confirmationValue=='') {
alert("Please Fill All Fields");
}
else {
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "register.php",
data: dataString,
cache: false,
success: function(result){
alert(result);
}
});
}
return false;
});
});
Im new to angular js i want to post a url to server
this is my code
Index.html
<html ng-app="signupApp">
<head>
<title>ServicePrice Signup</title>
<link rel="stylesheet" href="css/animations.css" />
<link rel="stylesheet" href="css/login.css" />
<link rel="stylesheet" href="css/foundation.min.css" />
</head>
<body>
<div class="centerwrap">
<div class="Signup" ng-controller="SignupController">
<!-- <form action="signin()"> -->
<h2>Signup</h2>
<label for="email">Email</label>
<input type="email" ng-model="email">
<label for="password">Password</label>
<input type="password" ng-model="password">
<input type="submit" class="button" ng-click="signup()">
</div>
<!-- </form> -->
</div>
<script type="text/javascript" src="angular/angular.min.js"></script>
<script type="text/javascript" src="js/controller.js"></script>
</body>
</html>
controller.js
var signupApp = angular.module('signupApp', [])
var site = "http://devhosting.wiredelta.in:9009";
signupApp.controller('SignupController', function($scope, $http) {
$scope.signup = function() {
var data = {
email: $scope.email,
password: $scope.password
};
$http({
url: site + '/company/signup',
method: "POST",
data: data,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}).success(function(data) {
console.log(data);
}).error(function(res) {
console.log(res);
});
}
});
how can clear this error and get response from server
both email and password reaches server but is says "bad request" all the time
error in console
POST http: //devhosting.wiredelta.in:9009/company/signup 400 (Bad Request)
controller.js: 24 Object {
error: Object
}
error: Objectmessage: "Data is not valid"
type: "BadRequestError"
__proto__: Object__proto__: Object
Unfortunately, Angular does not automatically encode the parameters in a formpost, like in jQuery.
You have to do this yourself, just like you have to add the header 'Content-Type': 'application/x-www-form-urlencoded' yourself, like you already did.
If you include jQuery you can do it like this: $.param(data)
I finaly found it as yang li told we need to convert data , so i used this
transformRequest: function(obj) {
var str = [];
for (var p in obj)
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
return str.join("&");
}