We Keep Coding

How to get current record id in odoo 14 js

I save the current record using
$(".o_form_button_save").click();
Now I want to get the record id of this record. While printing "this", I am not able to find the id.

So for that you have to setup your event handler to call a function when event "click" arise . I think you should extend the FormView to do this in a clean manner.
Here is some pseudo code
FormView.extend({
events: {
'click #target button': 'button_clicked',
},
button_clicked: function(ev) {
//your logic
var field_values = this.get_fields_values();
var id = field_values['id']
});
Hope this helps, please inform me of the result !

For anyone who is looking for solution, try this :
var ExtendFormController = FormController.include({
events: {
"click.get_id_button": "getID",
},
getID: function (ev){
console.log('Button Clicked')
var recordID = Object.values(this.model.localData)[0]["data"]['id']
console.log(recordID)
},
});
reference in comments : https://www.youtube.com/watch?v=lLbjhlXqt98

jQuery .remove() does not work with div created inside the function

I've tried a couple of things since yesterday, but I can't achieve my goal.
The idea is :
When clicking on a character "Div", it appears a little menu to change a parameter inside my website. The problem is, I want to remove the "Class Picker", but it just does not work.
var CharacterClasses = [
{ id: 1, name: 'Warrior', cssClass: 'warrior'},
{ id: 2, name: 'Paladin', cssClass: 'paladin'},
...
]
$('.group_miniature').click( function(){
// Removing all existant class choices
$(".group-panel_class_picker").remove()
// Creating the class picker
var Panel = $("<div id=\"panel_class_picker\"></div>").addClass('group-panel_class_picker')
// Append the whole thing
$(this).append(Panel)
// Iterating each class to add a div
CharacterClasses.forEach( function(item){
// Creating the div
let btn_class = $("<div>&nbsp</div>").addClass( [item.cssClass,'group-btn_class'] )
Panel.append(btn_class)
Panel.on("click", ".group-btn_class", function(event){
$(this).parent().remove() // This is my problem, it does not remove the parent
console.log('Click :)') // This appears in my console
})
})
})

Panel.on("click", ".group-btn_class", function(event){
$(this).parent().hide()
event.stopPropagation()
console.log('Click criss')
})
I discovered that I had to add event.stopPropagation()
Now it works just fine ! :)

jQuery .bind('show') not working appropriately when element is shown via jQuery

I have a snippet in my project similar to the one seen below:
$('#field').change(function() {
var thisCondition = $(this).val();
if(thisCondition) {
$('#this_container').fadeIn();
}
});
The above snippet is working. When thisCondition evaluates to true, the container does fade in. However, I also have the snippet below that is not functioning as expected. It binds to show so that when the container fades in an event will be triggered:
$('#this_container').bind('show', function() {
$.ajax({
...
});
});
Shouldn't the snippet above react to line 5 in the change event handler? Why is the bind method not triggering?

Confirmed that show is not a valid nor jQuery-triggered event.
But you can trigger it yourself!
Try something like this :
$('#this_container').fadeIn("slow", function() {
$(this).trigger("show");
});

The show is not a valid event, neither is triggered by jQuery. You need to construct your script in a different way altogether:
$('#field').change(function() {
var thisCondition = $(this).val();
if(thisCondition) {
$.ajax({
success: function () {
$('#this_container').fadeIn();
}
});
}
});
So, you can try to bring the AJAX content, and upon a successful request, you can show the container.

try to use :
$('#this_container').fadeIn( "slow", function() {
// Animation complete
$.ajax({
...
});
});

More than one events are added to an inner view backbone?

So here I have two views addBook and showBooks , the idea is, as I click on a button it should add a book name and author to the DOM its an , and I should be able to click it. But the problem is for each element more than one event handlers are added. that is for each new inner view more than one click events are added, I am quite new in backbone and I am still in Dark
here is my code , first the outer view
var addBook = Backbone.View.extend({
el : $('#addbook'),
model : bookmodel,
template : _.template(addbookTemplate,{}),
initialize : function(val){
this.el.html(this.template);
bookcollection.bind('add', this.showOff)
},
render : function(){
},
events : {
'click #addbookbutton' : 'addHandler'
},
addHandler : function(){
var book = new this.model;
book.addValues($('#bookname').val(), $('#bookauthor').val());
bookcollection.add(book);
},
showOff : function(buk){
this.xx = new showval({model: buk});
$('#fatman').append((this.xx.render().el));
}
});
return addBook;
Now the second and inner view
var showbooks = Backbone.View.extend({
events : {
'click .individual' : 'deleteHandler'
},
initialize : function(values){
_.bindAll(this);
/*if(values){*/
//return this.template;
//}
//values = (values == "") ? {} : values;
this.el.append(this.template);
},
render : function(){
this.el = _.template(show, {name : "Max", author : "jk"});
this.delegateEvents();
return this;
},
deleteHandler : function(e){
alert("this kills me")
}
});
return showbooks;
Now here is the problem as I click the button is added to DOM button but for each new li one more alert is fired ... Help is highly appreciated , I know I am missing some crucial point .. !!

I have taken your code and changed it slightly. I have created 2 Backbone.View's, one as the container and one for book items. It's crude, but hopefully will give you an idea of where you have gone wrong. http://jsfiddle.net/cQEu2/

Redefining a jQuery dialog button

In our application we use a general function to create jQuery dialogs which contain module-specific content. The custom dialog consists of 3 buttons (Cancel, Save, Apply). Apply does the same as Save but also closes the dialog.
Many modules are still using a custom post instead of an ajax-post. For this reason I'm looking to overwrite/redefine the buttons which are on a specific dialog.
So far I've got the buttons, but I'm unable to do something with them. Is it possible to get the buttons from a dialog (yes, I know) but apply a different function to them?
My code so far:
function OverrideDialogButtonCallbacks(sDialogInstance) {
oButtons = $( '#dialog' ).dialog( 'option', 'buttons' );
console.log(oButtons); // logs the buttons correctly
if(sDialogInstance == 'TestInstance') {
oButtons.Save = function() {
alert('A new callback has been assigned.');
// code for ajax-post will come here.
}
}
}

$('#dialog').dialog({
'buttons' : {
'Save' : {
id:"btn-save", // provide the id, if you want to apply a callback based on id selector
click: function() {
//
},
},
}
});
Did you try this? to override button's callback based on the need.

No need to re-assign at all. Try this.
function OverrideDialogButtonCallbacks(dialogSelector) {
var button = $(dialogSelector + " ~ .ui-dialog-buttonpane")
.find("button:contains('Save')");
button.unbind("click").on("click", function() {
alert("save overriden!");
});
}
Call it like OverrideDialogButtonCallbacks("#dialog");
Working fiddle: http://jsfiddle.net/codovations/yzfVT/

You can get the buttons using $(..).dialog('option', 'buttons'). This returns an array of objects that you can then rewire by searching through them and adjusting the click event:
// Rewire the callback for the first button
var buttons = $('#dialog').dialog('option', 'buttons');
buttons[0].click = function() { alert('Click rewired!'); };
See this fiddle for an example: http://jsfiddle.net/z4TTH/2/
If necessary, you can check the text of the button using button[i].text.
UPDATE:
The buttons option can be one of two forms, one is an array as described above, the other is an object where each property is the name of the button. To rewire the click event in this instance it's necessary to update the buttons option in the dialog:
// Rewire the callback for the OK button
var buttons = $('#dialog').dialog('option', 'buttons');
buttons.Ok = function() { alert('Click rewired!'); };
$('#dialog').dialog('option', 'buttons', buttons);
See this fiddle: http://jsfiddle.net/z4TTH/3/

Can you try binding your new function code with Click event of Save?
if(sDialogInstance == 'TestInstance') {
$('#'+savebtn_id).click(function() {
alert('A new callback has been assigned.');
// code for ajax-post will come here.
});
}